我试图在单击元素后从元素中删除事件监听器,尽管我似乎有一个可行的解决方案,但它并不理想,而且我不确定为什么它的工作方式与损坏的代码不同。
虽然我意识到有更简单的方法可以做到这一点,但这取 self 正在开发的 JS 类,因此需要保留一些结构。
这与我之前发表的一篇文章有关,该文章已正确回答(但在我扩展示例时不起作用)- Removing event listeners with anonymous function calls in JavaScript .
在此示例中,最后创建的 div 正确删除了监听器,但较早创建的 div 则不然(此处摆弄 - http://jsfiddle.net/richwilliamsuk/NEmbd/ ):
var ctnr = document.getElementById('ctnr');
var listener = null;
function removeDiv (d) {
alert('testing');
d.removeEventListener('click', listener, false);
}
function addDiv () {
var div = document.createElement('div');
div.innerHTML = 'test';
ctnr.appendChild(div);
div.addEventListener('click', (function (d) { return listener = function () { removeDiv(d); } })(div), false);
}
addDiv();
addDiv();
addDiv();
在我工作的版本中,我创建了一个包含所有监听器的数组(此处 fiddle - http://jsfiddle.net/richwilliamsuk/3zZRj/ ):
var ctnr = document.getElementById('ctnr');
var listeners = [];
function removeDiv(d) {
alert('testing');
d.removeEventListener('click', listeners[d.id], false);
}
function addDiv() {
var div = document.createElement('div');
div.innerHTML = 'test';
ctnr.appendChild(div);
div.id = listeners.length;
div.addEventListener('click', (function(d) {
return listeners[listeners.length] = function() {
removeDiv(d);
}
})(div), false);
}
addDiv();
addDiv();
addDiv();
document.getElementById('btn').addEventListener('click', function() {
alert(listeners);
}, false);
最后一个工作正常,但我确信监听器数组不是必需的。也许我担心太多,但我想知道最佳解决方案。
最佳答案
你是对的,你不需要一个数组,只需将每个监听器保存在一个变量中,而不是在你的remove()函数中传递事件监听器,
var ctnr = document.getElementById('ctnr');
function removeDiv(d, ev) {
alert('testing');
d.removeEventListener('click', ev, false);
}
function addDiv() {
var div = document.createElement('div');
div.innerHTML = 'test';
ctnr.appendChild(div);
div.addEventListener('click', (function(d) {
var myfunc;
return myfunc = function() {
removeDiv(d, myfunc);
}
})(div), false);
}
addDiv();
addDiv();
addDiv();
document.getElementById('btn').addEventListener('click', function() {
alert(listeners);
}, false);
关于javascript - 删除自动创建的多个元素上的事件监听器,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10041644/