javascript - 如何使用事件监听器内定义的函数删除事件监听器？

Question

我有事件监听器，其函数在事件监听器内定义为:

$("body")[0].addEventListener( "click", function my3(){alert(786)});

现在，当我尝试删除此事件监听器时:

$("body")[0].removeEventListener( "click", function my3);

我收到 my3 未定义的错误。有什么方法可以删除这些类型的事件监听器，或者在事件监听器之外定义 my3 函数是唯一的方法吗？

Answer 1

Is there any way to remove these type of eventlisteners...

不，不能使用 addEventListener/removeEventListener。但您已标记 jquery ，所以请继续阅读，因为您可以使用 jQuery。

...or defining my3 function outside the event listener is the only way?

这是使用 addEventListener/removeEventListener 的唯一方法。您需要引用已添加的函数才能将其删除。所以:

// Declare the function
function my3() {
    alert(786);
}

// Add it
$("body")[0].addEventListener( "click", my3);

// Later, remove it
$("body")[0].removeEventListener( "click", my3);

您已标记您的问题 jquery ，所以我会注意到，对于 jQuery 附加的处理程序来说，这不是，因为 jQuery 维护自己的事件处理程序列表，而不是使用 native DOM 的列表。这意味着您可以从元素中删除通过 jQuery 附加的事件的所有处理程序，而无需引用它们，和/或使用 jQuery 的“命名空间”事件仅删除其中的一个子集，同样无需引用它们.

例如:

$("body").on("click.foo", function my3() { alert(786); });

在那里，我们用 foo 对我们的点击处理程序进行了“命名空间”。稍后，我们可以删除我们的处理程序而不影响任何其他点击处理程序:

$("body").off("click.foo");

on 文档中的详细信息和 off .