jquery .off似乎不起作用

Question

所以我會很簡短：jquery .off()不會禁用我用.on設置的.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按鈕將testfunc()添加到myspan 。 在我們這樣做之后，如果我們點擊跨度，我們會收到警報。 接下來，我們單擊jquery off按鈕。 這應該是刪除監聽器，但它沒有。 即使在那之后，當我們點擊myspan testfunc仍然附加。

為什么？ 我該如何刪除它？

Answer 1

您的參數不匹配

它不是因為你綁定了一個不同的功能（匿名的）。 然后你試圖從testfunc解除綁定...為了使你的事件（un）綁定工作， on和off之間的參數必須匹配 。

可能的解決方法

如果這是元素上唯一的click事件偵聽器，那么通過調用以下方法解除匿名函數取消是最簡單的方法：

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

如果您將多個事件處理程序綁定到同一元素上的click事件，那么您還可以通過提供命名空間來區分它們，然后在off函數中使用正確的命名空間。

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

如果您想取消綁定使用相同命名空間綁定的幾個不同的事件處理程序，請使用just namespace：

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

Answer 2

你沒有將事件處理程序綁定到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");

Answer 3

在這個簡單的情況下，更換您off這個調用：

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

您不需要將處理函數傳遞給off函數，如果這樣做，它將只刪除該特定處理程序。 但是，您沒有附加testfunc ，而是一個只調用testfunc()的匿名函數。 因此，您的off呼叫無效。

此外，您從未分配變量testfunc 。