किसी तत्व में सभी श्रोताओं को कैसे हटाया जाए?

Question

मैं एक बटन है, और मैं इसे करने के लिए कुछ eventlistners कहा:

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> 

मैं उन्हें निकाल सकते हैं फ़ंक्शन संदर्भ नहीं है (funcA)? क्या ऐसा करने का कोई तरीका है, या मुझे उन्हें एक-एक करके हटाना है?

Answer 1

मुझे लगता है कि सिर्फ नोड है, जो सभी घटना श्रोताओं को हटा देगा क्लोन करने के लिए है यह करने के लिए सबसे तेज़ तरीका:,

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

बस सावधान रहना होगा के सभी बच्चे तत्वों पर यह भी साफ़ हो जाएंगे घटना श्रोताओं के रूप में प्रश्न में नोड, इसलिए यदि आप यह संरक्षित करना चाहते हैं कि आपको एक समय में श्रोताओं को स्पष्ट रूप से हटाने का सहारा लेना होगा।

Answer 2

आप jQuery के खिलाफ नहीं रहे हैं, यह एक पंक्ति में किया जा सकता है:

jQuery 1.7+

$("#myEl").off() 

jQuery < 1,7

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

यहाँ एक उदाहरण:

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

Answer 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")); 

एक तत्व पर निकालें घटना श्रोताओं और उसके बच्चों के सभी:

एक तत्व पर 210

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

---

आप वस्तु ही रखने के लिए और इसलिए cloneNode उपयोग नहीं कर सकते की जरूरत है, तो आप addEventListener समारोह लपेटो और अपने आप से श्रोता सूची पर नज़र रखने, this answer में की तरह किया है।