DOM Rimozione dei listener di eventi

Esempio

Il metodo removeEventListener () rimuove i gestori di eventi che sono stati collegati con il metodo addEventListener ():

element.removeEventListener("mousemove", myFunction);

Tutto (nome evento, funzione e opzioni) in removeEventListener deve corrispondere a quello impostato quando si aggiunge il listener di eventi all'elemento.

.leggi con removeListener

usando .bind sulla funzione quando si aggiunge un listener di eventi si impedirà la rimozione della funzione, per rimuovere effettivamente l'eventListener che è possibile scrivere:

function onEvent() {
   console.log(this.name);
}

var bindingOnEvent = onEvent.bind(this);

document.addEventListener('click', bindingOnEvent);

...

document.removeEventListener('click', bindingOnEvent);

ascoltare un evento solo una volta

Fino a once opzione è ampiamente supportata, dobbiamo rimuovere manualmente il listener pari una volta che l'evento viene attivato per la prima volta.

Questo piccolo aiuto ci aiuterà a raggiungere questo obiettivo:

Object.prototype.listenOnce = Object.prototype.listenOnce ||
  function listenOnce(eventName, eventHandler, options) {
      var target = this;
      target.addEventListener(eventName, function(e) {
          eventHandler(e);
          target.removeEventListener(eventName, eventHandler, options);
      }, options);
  }

var target = document.querySelector('#parent');
target.listenOnce("click", clickFunction, false);

* Non è una buona pratica associare funzioni al prototipo Object, quindi è possibile rimuovere la prima riga di questo codice e aggiungere un target ad esso come primo parametro.