为什么我的 JavaScript removeEventListener() 不起作用？

Javascript removeEventListener 不起作用

在此代码中，使用 addEventListener() 方法将事件侦听器添加到元素：

area.addEventListener('click',function(event) ...,true);

后来，在另一个函数中，尝试使用removeEventListener()方法删除事件监听器：

area.removeEventListener('click',function(event) ...,true);

但是，事件监听器没有被删除。为什么会发生这种情况？

问题：
问题在于作为参数传递给 addEventListener() 和 removeEventListener() 方法的两个匿名函数是两个 不同的功能。当使用以下代码添加事件监听器时：

area.addEventListener('click',function(event) ...,true);

运行时创建一个新的、唯一的匿名函数对象并将其分配给区域元素的单击事件处理程序。

当使用以下代码删除事件侦听器：

area.removeEventListener('click',function(event) ...,true);

创建 不同新的、唯一的匿名函数对象并将其分配给区域元素的单击事件处理程序。第一个函数没有移除，所以继续处理点击事件。

解决方案：
要正确移除事件监听器，需要提供removeEventListener()方法引用传递给 addEventListener() 方法的同一函数对象。为此，事件侦听器应定义为命名函数，然后该命名函数应用作 addEventListener() 和 removeEventListener() 方法的参数。例如：

function foo(event) {
  app.addSpot(event.clientX,event.clientY);
  app.addFlag = 1;
}
area.addEventListener('click',foo,true);
area.removeEventListener('click',foo,true);

以上是为什么我的 JavaScript removeEventListener() 不起作用？的详细内容。更多信息请关注PHP中文网其他相关文章！