요소에서 모든 리스너를 제거하는 방법?

요소에서 모든 리스너를 제거하는 방법? [복제]

---

이 질문에는 이미 답변이 있습니다.

• 자바 스크립트 / DOM : DOM 객체의 모든 이벤트를 제거하는 방법? 답변 11 개

버튼이 있는데 버튼을 추가 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>

나는 그들을 제거 할 수 있습니다 :

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

모든 리스너를 한 번에 제거하려면 함수 참조 ( funcA) 가없는 경우 어떻게합니까? 그렇게하는 방법이 있습니까, 아니면 하나씩 제거해야합니까?

---

가장 빠른 방법은 노드를 복제하여 모든 이벤트 리스너를 제거하는 것입니다.

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

문제가되는 노드의 모든 하위 요소에 대한 이벤트 리스너도 지워 지므로주의해서 리스너를 유지하려면 한 번에 하나씩 리스너를 명시 적으로 제거해야합니다.

---

jquery와 반대되는 경우 한 줄로 수행 할 수 있습니다.

jQuery 1.7 이상

$("#myEl").off()

jQuery <1.7

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

예를 들면 다음과 같습니다.

http://jsfiddle.net/LkfLezgd/3/

---

다음은 또한 기반 기능 cloneNode이지만 부모 노드 만 복제하고 모든 자식을 이동하여 이벤트 리스너를 유지하는 옵션이 있습니다.

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);
  }
}

한 요소에서 이벤트 리스너를 제거하십시오.

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

요소와 모든 하위 요소에서 이벤트 리스너를 제거하십시오.

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

---

객체 자체를 유지해야하므로 사용할 수없는 경우이 답변 과 같이 함수 cloneNode를 래핑 addEventListener하고 리스너 목록을 직접 추적해야합니다 .

참고 URL : https://stackoverflow.com/questions/9251837/how-to-remove-all-listeners-in-an-element