Jak usunąć wszystkich słuchaczy w elemencie? [duplikat]

To pytanie ma już odpowiedź tutaj:

Mam guzik i dodałem do niego trochę eventlistners: 

document.getElementById("btn").addEventListener("click", funcA, false);
document.getElementById("btn").addEventListener("click", funcB, false);
document.getElementById("btn").addEventListener("click", funcC, false);
document.getElementById("btn").addEventListener("blur" , funcD, false);
document.getElementById("btn").addEventListener("focus", funcE, false);

<button id="btn">button</button>

Mogę je usunąć przez: 

document.getElementById("btn").removeEventListener("click",funcA);

Co jeśli chcę usunąć wszystkie słuchacze na raz, lub nie mam referencji funkcji (funcA)? Czy jest jakiś sposób czy mam je usuwać jeden po drugim?

Author: Kevin Guan, 2012-02-12
Source

3 answers

Myślę, że najszybszym sposobem na to jest po prostu sklonowanie węzła, który usunie wszystkie słuchacze zdarzeń: 

var old_element = document.getElementById("btn");
var new_element = old_element.cloneNode(true);
old_element.parentNode.replaceChild(new_element, old_element);

Po prostu bądź ostrożny, ponieważ spowoduje to również wyczyszczenie słuchaczy zdarzeń na wszystkich elementach podrzędnych danego węzła, więc jeśli chcesz to zachować, będziesz musiał uciekać się do jawnego usuwania słuchaczy pojedynczo.

 117
Author: Ben D,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2012-02-13 04:34:08

Jeśli nie jesteś przeciwny jquery, można to zrobić w jednej linii:

JQuery 1.7+

$("#myEl").off()

JQuery 

$('#myEl').replaceWith($('#myEl').clone());

Oto przykład:

Http://jsfiddle.net/LkfLezgd/3/

 27
Author: Duke,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2015-04-06 18:32:43

Oto funkcja, która jest również oparta na cloneNode, ale z opcją klonowania tylko węzła nadrzędnego i przenoszenia wszystkich dzieci (w celu zachowania ich słuchaczy zdarzeń): 

function recreateNode(el, withChildren) {
  if (withChildren) {
    el.parentNode.replaceChild(el.cloneNode(true), el);
  }
  else {
    var newEl = el.cloneNode(false);
    while (el.hasChildNodes()) newEl.appendChild(el.firstChild);
    el.parentNode.replaceChild(newEl, el);
  }
}

Usuń słuchacze zdarzeń na jednym elemencie: 

recreateNode(document.getElementById("btn"));

Usuń słuchacze zdarzeń na elemencie i wszystkich jego dzieciach: 

recreateNode(document.getElementById("list"), true);

Jeśli chcesz zachować sam obiekt i dlatego nie możesz użyć cloneNode, musisz zawinąć funkcję addEventListener i śledzić listę słuchaczy samodzielnie, jak w this odpowiedź .

 5
Author: user,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2017-05-25 19:31:58