Bir elemandaki tüm dinleyiciler nasıl kaldırılır?

Question

bir düğme var ve ben bunun için bazı eventlistners eklendi: Ben hepsini birden dinleyicileri kaldırabilir ya İstiyorum istersem ne

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

:

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> 

ben onları kaldırabilirsiniz İşlev referansı (funcA) yok mu? Bunu yapmanın bir yolu var mı yoksa bunları birer birer mi çıkarmalıyım?

Answer 1

Bunu yapmanın en hızlı yolu sadece tüm olay dinleyicileri kaldırır düğümü, klonlamak olduğunu düşünüyorum:,

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

Sadece dikkatli olun her alt öğeleri bu de temizlenir olay dinleyicileri olarak Söz konusu düğüm, bu nedenle korumak istiyorsanız, dinleyicileri her seferinde açık bir şekilde çıkarmak için başvurmanız gerekir. İşte

jQuery 1.7+

$("#myEl").off() 

jQuery < 1,7

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

: Eğer jquery karşı değilsin Eğer

Answer 2

, bu bir çizgide yapılabilir bir örnek:

İşte

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

Answer 3

da cloneNode dayanan bir fonksiyon, ama bir seçenek Üst düğüm klonlamak ve taşımak için bütün çocuklar (kendi olay dinleyicilerini korumak için):

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

Kaldır olay dinleyicileri bir öğeyi

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

Kaldır olay dinleyicileri ve tüm alt öğelerinin:

bir elemana Eğer nesnenin kendisini tutmak ve bu nedenle cloneNode kullanamaz gerekiyorsa 210

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

---

, o zaman addEventListener fonksiyonunu sarın ve this answer olduğu gibi başınıza dinleyici Parça listesine sahiptir.