不能使用删除事件监听器

function attachEvent(element, event, callbackFunction) { 
    if(element.addEventListener) { 
    element.addEventListener(event, function(){ 
     removeArray(); 
     callbackFunction(this.getAttribute("src")); 
    }, false); 
    } 
} 


function removeEvent(){ 
    var element = document.querySelectorAll('.Dicon'); 
    element.removeEventListener("click", handler); 
    console.log("remove"); 
}

我有一个高级应召迪康，我用addEventlistner一些图像给他们点击的能力，但现在我想删除eventlistner，但不知何故，我不能使它工作，我得到错误。不能使用删除事件监听器

错误

Uncaught TypeError: element.removeEventListener is not a function

如何解决这个问题？他们都是形象。

来源

2016-04-15 darkness

document.querySelectorAll()返回的HTMLCollection，所以你需要通过项目环从每个项目中删除监听器：

var element = document.querySelectorAll('.Dicon'); 
Array.prototype.forEach.call(element, function(el) { 
    el.removeEventListener("click", handler); 
});

还要注意有关完全相同的函数引用删除处理什么@T.J. Crowder states in his answer's秒块。

来源

2016-04-15 10:16:59 baao

功能工作，但不知何故onclick不删除。 – darkness

查看@ T.J.Crowder的解释！ – baao

querySelectorAll返回一个集合，而不是一个单一的元素。如果您只想获得第一个匹配元素，请使用querySelector（否All）。否则，您使用length来索引该集合（例如，第一个匹配元素为[0]，第二个元素为[1]），以知道其中有多少个元素。您还需要定义handler。

请注意，您不能删除你在你的第一个代码块使用addEventListener附处理，因为删除处理程序，你必须提供给removeEventListener的相同函数引用因为你给了到addEventListener，并且您没有该引用，因为您直接将函数表达式传递到addEventListener。

您需要在某处保留该引用（例如，变量或属性）以便稍后使用该引用来删除处理程序。

来源

2016-04-15 10:17:11

@TJ，如果我们不保留引用，那么无法删除事件侦听器？ – Rayon

@RayonDabre：没有。你必须销毁和替换元素。这是让我继续使用jQuery的原因之一：你可以删除所有处理程序或所有具有给定“名称空间”的处理程序等等。这可能是因为jQuery只在给定元素上绑定给定事件**一次** ，然后它使用自己的处理程序列表将该事件分派给我们的代码。没有办法与原生DOM方法做到这一点。 –

@TJ，基本上'jQuery'保持参考？如果我读你的正确.. – Rayon

不能使用删除事件监听器

回答

相关问题