Javascript 无法使用删除事件侦听器

我有一些类调用Dicon的图像，我使用addEventlistner让它们能够点击，但现在我想删除eventlistner，但不知怎么的，我无法让它工作，我得到了错误

错误

---

如何解决此问题？它们都是图像。

document.queryselectoral（）

返回一个htmlCollection，因此您需要遍历这些项以从每个项中删除侦听器：

Uncaught TypeError: element.removeEventListener is not a function 

---

还请注意第二个块是关于为完全相同的函数引用删除处理程序的

document.querySelectorAll（）

返回一个htmlCollection，因此您需要遍历这些项以从每个项中删除侦听器：

Uncaught TypeError: element.removeEventListener is not a function 

---

还请注意第二个块是关于为完全相同的函数引用删除处理程序的

querySelectorAll

返回集合，而不是单个元素。如果只想获取第一个匹配元素，请使用

querySelector

（no

All

）。否则，您将索引到集合中（例如，对于第一个匹配元素，

[0]

，对于第二个匹配元素，

[1]

），使用

长度

知道有多少个

您还需要定义

处理程序

请注意，不能在第一个代码块中删除使用

addEventListener

附加的处理程序，因为要删除处理程序，必须提供与

addEventListener

相同的函数引用，您没有该引用，因为您直接将函数表达式传递到

addEventListener

---

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

querySelectorAll

返回一个集合，而不是单个元素。如果只想获取第一个匹配元素，请使用

querySelector

（no

All

）。否则，您将索引到集合中（例如，对于第一个匹配元素，

[0]

，对于第二个匹配元素，

[1]

），使用

长度

知道有多少个

您还需要定义

处理程序

请注意，不能在第一个代码块中删除使用

addEventListener

附加的处理程序，因为要删除处理程序，必须提供与

addEventListener

相同的函数引用，您没有该引用，因为您直接将函数表达式传递到

addEventListener

---

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

@TJ，如果我们不保留引用，则无法删除事件侦听器？@RayonDabre:no。您必须销毁并替换该元素。这是促使我继续使用jQuery的原因之一：您可以删除所有处理程序，或具有给定“名称空间”的所有处理程序，等等。这是可能的，因为jQuery只在给定元素上钩住给定事件一次，然后使用自己的处理程序列表将该事件分派到代码中。用原生DOM方法无法做到这一点。@RayonDabre：没错。jQuery附加一个处理程序（它自己的），并将我们提供给它的处理程序保留在它自己的数组中。当事件发生时，它通过其数组循环，调用处理程序。这也是为什么它能够使处理程序按照DOM2定义的顺序被调用的原因，即使在旧的Microsoft浏览器上，使用

attachEvent

，它（碰巧）以相反的顺序调用它们。谢谢您的时间！你是一个完整的参考资料：）@TJ，如果我们不保留参考资料，就无法删除事件侦听器？@RayonDabre:no。您必须销毁并替换该元素。这是促使我继续使用jQuery的原因之一：您可以删除所有处理程序，或具有给定“名称空间”的所有处理程序，等等。这是可能的，因为jQuery只在给定元素上钩住给定事件一次，然后使用自己的处理程序列表将该事件分派到代码中。用原生DOM方法无法做到这一点。@RayonDabre：没错。jQuery附加一个处理程序（它自己的），并将我们提供给它的处理程序保留在它自己的数组中。当事件发生时，它通过其数组循环，调用处理程序。这也是为什么它能够使处理程序按照DOM2定义的顺序被调用的原因，即使在旧的Microsoft浏览器上，使用

attachEvent

，它（碰巧）以相反的顺序调用它们。谢谢您的时间！你是一个完整的参考资料：）函数工作，但不知何故onclick并没有移除。请参阅@T.J.Crowder的解释！为什么必须使用

Array.prototype

而不是for-loop？函数可以工作，但不知何故onclick没有被删除。请参阅@T.J.Crowder的解释！为什么必须使用

Array.prototype

而不是for循环？

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