JavaScript/DOM/EventTarget/removeEventListener

Aus SELFHTML-Wiki
Wechseln zu: Navigation, Suche

Die Methode EventTarget.removeEventListener() entfernt einen Event-Handler, der mit der addEventListener-Methode hinzufügt wurde.

Syntax target.removeEventListener(type, listener[, useCapture]);

  • type: String mit dem Ereignistyp
  • listener: Handler-Funktion
  • useCapture: optionaler Boolean-Wert für die Event-Phase.

Anwendungsbeispiel

Beispiel ansehen …
document.addEventListener('DOMContentLoaded', function () {
  document.getElementById('buehne').addEventListener('mousemove', holeKoordinaten);
  document.getElementById('entferne').addEventListener('click', entferneHandler);	
  
  
  function entferneHandler() {
    document.getElementById('buehne').removeEventListener('mousemove', holeKoordinaten);
  }
 
  function holeKoordinaten(e) {
    x = e.clientX;
    y = e.clientY;
    document.getElementById('x').innerHTML = x;
    document.getElementById('y').innerHTML = y;
  }
  
});

Das main-Element im Beispiel hat einen mousemove-EventHandler, der die Position der Maus innerhalb des Elements anzeigt. Ein Klick auf den Button entfernt den EventHandler.


Beachten Sie: Um Event-Handler zu entfernen, müssen die zuvor mit addEventListener hinzugefügten Funktionen externe Funktionen sein. Anonyme Funktionen wie element.removeEventListener("event", function(){ meinScript }); können nicht entfernt werden.

UseCapture / EventListenerOptions

Wird ein Eventhandler für die Capturing-Phase registriert, muss das auch bei der Deregistrierung angegeben werden. Der dritte Parameter von addEventListener muss in gleicher Form an removeEventListener übergeben werden.

Siehe auch

Weblinks