Javascript Event Listener entfernen

Question

Wenn ich mehrere Event Listener für das selbe Event auf dem selben Element registriert habe, wie kann ich dann einen speziellen davon wieder löschen?

var meinElement = document.getElementById('meinElementId');

meinElement.addEventListener('click', function() {
  console.log('Erster Event Listener');
});

meinElement.addEventListener('click', function() {
  console.log('Zweiter Event Listener');
});

Answer 1

Um einen Event Listener zu entfernen, musst du eine Funktion verwenden, die du beim Hinzufügen des Listeners speichern musst. Das ist notwendig, da anonyme Funktionen oder Funktionen ohne Namen nicht direkt entfernt werden können.

var meinElement = document.getElementById('meinElementId');

function ersterListener() {
  console.log('Erster Event Listener');
}

function zweiterListener() {
  console.log('Zweiter Event Listener');
}

meinElement.addEventListener('click', ersterListener);
meinElement.addEventListener('click', zweiterListener);

// Um den ersten Event Listener zu entfernen
meinElement.removeEventListener('click', ersterListener);