Question

有人可以解释一下，为什么脚本表现如此：当我在#wrapper click handler中声明函数fn时，.off（）方法不会从#cover中删除处理程序。

$('#wrapper').on('click', 'button', function (){
function fn(){
  alert('on')
}
    if($(this).is('#add')){
        $('#info').text('event added')
        $('#cover').on('click', fn)
    }

    if($(this).is('#remove')){
        $('#info').text('event removed');
        $('#cover').off('click', fn);
    }
})

但是当它在外面（全球范围）时它可以正常工作。

function fn(){
  alert('on')
}
$('#wrapper').on('click', 'button', function (){

    if($(this).is('#add')){
        $('#info').text('event added')
        $('#cover').on('click', fn)
    }

    if($(this).is('#remove')){
        $('#info').text('event removed');
        $('#cover').off('click', fn);
    }
})

JSFiddle link这里

Answer 1

前者的问题是，当您再次点击按钮时，您将重新定义fn，换句话说，您的on和off函数接收参数fn完全不同

Answer 2

这是一个范围问题。如果在$（＆＃39; #wrapper＆＃39;）内定义（＆＃39;点击＆＃39; fn变量将包含对该函数的引用，并且每次都是另一个引用

因此，off会尝试删除与最初使用on

设置的引用不同的引用来删除该事件

如果在全局范围内定义fn，它将在整个执行过程中保留相同的引用

jQuery .off（）方法中的函数处理程序

2 个答案: