javascript - 将事件监听器存储在函数中并调用该函数

Question

我在函数中有一个事件监听器，每次调用该函数时，事件监听器都会不断附加，并且事件监听器中的代码会根据调用该函数的次数多次触发。我该如何解决这个问题？

function myFunction() {
    $("#element").on("click", function() {
        alert("test");
    }
}

$("body").on("click", function() {
    myFunction();
});

每次调用 myFunction() 时都会添加一个额外的单击事件监听器，因此如果我单击正文 5 次，则单击“#element”。尽管只点击一次，但警报消息将运行 5 次。

Answer 1

如果必须这样做，请先使用off，然后使用on，以确保它不会连接多次。为了确保您不会删除其他人的处理程序，请向事件添加自定义命名空间(例如下面的 .mycustom):

function myFunction() {
    $("#element").off('click.mycustom').on("click.mycustom", function() {
        alert("test");
    }
}

自定义命名空间对事件没有影响，但请确保您稍后可以使用 off 访问特定版本的 click。