Cum se elimină un handler de eveniment?

Pentru a elimina un handler de evenimente, se folosește metoda removeEventListener(). Aceasta acceptă aceiași trei argumente ca și addEventListener():

1. Tipul evenimentului (șir, de exemplu 'click', 'mouseover').
2. Referința către funcția handler care a fost atribuită.
3. Obiectul opțional sau valoarea booleană care indică faza (captură sau bubbling). Trebuie să coincidă cu cel folosit la adăugare.

Important: pentru a elimina cu succes, trebuie să se transmită exact aceeași referință de funcție ca și cea folosită la adăugare. Funcțiile anonime create "din mers" nu pot fi eliminate în acest mod.

Exemplu:

// Obțineți elementul
const element = document.getElementById('myButton');

// Definiți funcția handler
function handleClick() {
  console.log('Buton apăsat!');
}

// Adăugați handler-ul
element.addEventListener('click', handleClick);

// ...cod...

// Eliminați handler-ul
element.removeEventListener('click', handleClick);

Dacă handler-ul a fost adăugat cu opțiuni, de exemplu useCapture: true, acestea trebuie specificate și la eliminare:

element.addEventListener('click', handleClick, { capture: true });

// ...

element.removeEventListener('click', handleClick, { capture: true });

Dacă argumentul al treilea a fost omis la adăugare (valoare implicită false), poate fi omis și la eliminare sau setat la false:

element.addEventListener('click', handleClick); // useCapture: false implicit

// ...

element.removeEventListener('click', handleClick);
element.removeEventListener('click', handleClick, false); // echivalent