jquery .off似乎不起作用

时间:2014-01-11 20:08:22

标签: javascript jquery

所以我会很简短:jquery .off()不会禁用我使用.on设置的收听。

HTML:

<span id="myspan">lol</span>
<button id="b1">jquery On</button>
<button id="b2">jquery Off</button>

JS:

$("#b1").on("click", add);
$("#b2").on("click", del);

function add() {
    $("#myspan").on("click", function(e) {
        var a = 1;
        testfunc(a, e);
    });
}

function del() {
    $("#myspan").off("click", testfunc);
}

function testfunc(num, event) {
   alert(num);
}

首先,我们点击 jquery On 按钮,将{strong> myspan 添加到testfunc()。在我们这样做之后,如果我们点击跨度,我们会收到警报。接下来,我们单击 jquery off 按钮。这应该是删除监听器,但它没有。即便如此,当我们点击 myspan testfunc时仍然会附加。

为什么呢?我该如何删除它?

3 个答案:

答案 0 :(得分:17)

您的参数不匹配

它不是因为你绑定了一个不同的功能(匿名的)。然后,您尝试从testfunc取消绑定...为了使您的事件(联合国)绑定工作 onoff之间的参数必须匹配

可能的解决方法

如果这是元素上唯一的click事件侦听器,则通过调用以下方法解除匿名函数的绑定是最简单的方法:

$("#myspan").off("click");

如果您将多个事件处理程序绑定到同一元素上的click事件,那么您还可以通过提供命名空间来区分它们,然后在off调用中使用正确的命名空间。

$("#myspan").on("click.test", function(e) { ... });
...
$("#myspan").off("click.test");

如果您要取消绑定使用相同命名空间绑定的几个不同的事件处理程序,请使用just namespace:

$("#myspan").off(".test");

答案 1 :(得分:7)

你没有将事件处理程序绑定到testfunc,你将它绑定到一个匿名函数,并且你正在调用testfunc那个函数,所以你不能自动解除绑定这一点。

要么是

$("#myspan").on("click", testfunc); // bind function

然后

$("#myspan").off("click", testfunc); // unbind function

或取消绑定匿名函数,只需

$("#myspan").off("click"); // remove all handlers

或者您也可以命名处理程序

$("#myspan").on("click.test", function(e) {
    var a = 1;
    testfunc(a, e);
});

并仅删除该处理程序

$("#myspan").off("click.test");

答案 2 :(得分:1)

在这种简单的情况下,请将off来电替换为:

function del() {
    $("#myspan").off("click");
}

您不需要将处理函数传递给off调用,如果这样做,它将只删除该特定处理程序。但是,您没有附加testfunc,而是一个只调用testfunc()的匿名函数。因此,您的off电话无效。

此外,您从未指定变量testfunc