无法删除 Javascript 中 event.data 附加的 jQuery 事件侦听器

Question

我在使用 jQuery .off() 删除 jQuery 事件侦听器时遇到问题，它附加到带有 event.data 的按钮。这是我为执行所需操作而开发的代码：

function test1(){
    //some data to be used on click at button 'lets go'
    var i=1;
    function test2(event){
        event.data.i++;
        console.log("i="+event.data.i);
        console.log("i_original="+i);
    }

    $('#letsGo').off('click'); //cannot use, as it is required in global scope with different handler function
    $('#letsGo').off('click', test2); //not working
    $('#letsGo').off('click', {'i':i}, test2); //not working
    $('#letsGo').off('click', {'i':i}, test2(event)); //not working
    $('#letsGo').off('click', test2(event)}; //not working
   
    //some code here
    $('#letsGo').on('click', {'i':i}, test2); //this is where it get's attached after removing existing handler
}

以上函数按以下操作顺序调用：

test1() //function call
    click @ letsGo
    click @ letsGo
    click @ letsGo
test1() //again function call to remove existing handlers and attach new one
    click @ letsGo
test1() //again function call
    click @ letsGo
    click @ letsGo
.....continues

上述 jQuery .off() 方法的问题是它没有删除现有事件，而是总是附加一个新事件。因此，每当进行函数调用时，都会多一个事件侦听器。这不是期望的行为。

我想要这个函数 .off() 工作，即使有 event.data 属性.

所以，请帮我解决这个问题。

Answer 1

首先，命名空间您附加的事件：

$('#letsGo').on('click.test2', {'i':i}, test2);

然后，当您只想删除 test2 函数时，使用您之前创建的命名空间将其作为目标：

 $('#letsGo').off('click.test2');

无法删除 Javascript 中 event.data 附加的 jQuery 事件侦听器

Unable to remove jQuery event listener attached with event.data in Javascript

javascript

jquery

events

event-handling

jquery-events