如何解除特定事件处理程序的绑定

47

代码:

$('#Inputfield').keyup(function(e)
        {
            if(e.which == 13)
            {
                functionXyz();
            }
            else
            {
                functionZyx();
            }
    });  


$(document).keyup(function(exit) {
              if (exit.keyCode == 27) { functionZzy(); }
});

问题:如何删除keyCode == 27的keyup事件处理程序,并保持其他$(document).keyup事件处理程序的完整性?


7
为什么你把事件对象命名为“exit”? - Šime Vidas
keyCode==27 是附加到 $(document).keyup 的那个,请澄清。 - Felix Kling
4个回答

81

必须使用一个命名函数,这样当调用.unbind()时可以引用特定的处理程序,像这样:

function keyUpFunc(e) {
  if (e.keyCode == 27) { functionZzy(); }
}
$(document).keyup(keyUpFunc);

之后解绑时:

$(document).unbind("keyup", keyUpFunc);

69

你正在将事件处理程序附加到不同的元素上,因此可以安全地从特定对象中删除处理程序(我知道已经提到过了)。

为了完整起见,如果你想要为同一对象的同一事件附加多个处理程序,可以使用命名空间事件

$('#Inputfield').bind('keyup.keep', function(e){/*...*/});
$('#Inputfield').bind('keyup.notkeep', function(e){/*...*/});

$('#Inputfield').unbind('keyup.notkeep');
// or event  $('#Inputfield').unbind('.notkeep');
自从jQuery 1.7版本以后,.on.off 方法是添加和移除事件处理程序的首选方法。它们与.bind.unbind完全相同,并且还可以使用命名空间事件。

13
这是这里最好的答案,命名空间的概念非常有用,我一直在使用。它可以支持您(或更重要的是其他人)在以后添加事件绑定到相同的元素上而不知道它已经有事件绑定的情况下提供支持。当然,如果他们去使用$('#myelement').unbind('focus'),没有使用名称空间,你的事件将被解除绑定...因此,请告诉你的工作伙伴开始使用它! - calumbrodie
1
这很有用 - 对我来说是新东西 - 命名空间 - 谢谢! - foxybagga
2
虽然命名空间可能很有用,但能够针对已绑定的特定函数实例进行定位可能更有用。我有几个相同函数的实例绑定到我的文档上,我想仅销毁其中一个。命名空间对此无济于事。 - Frug
绝对最佳答案 - Nicolas Mariano Obregon
太棒了!我试图在一个函数中绑定事件,在另一个回调函数中解除绑定,但由于不同的作用域,我无法访问我想要解除绑定的函数。通过能够为事件命名空间,您可以禁用它们,而无需实际的函数本身。每天都会学到新东西。 - user3727561

9

jQuery允许您绑定事件,这些事件在第一次调用后将被解除绑定。如果您只想运行此keyup函数一次,请查看此处列出的.one()方法:http://api.jquery.com/one/

$(document).one('keyup', function(e) {
              if (e.keyCode == 27) { functionZzy(); }
});

7

如果您在一个元素上只有一个处理程序,那么您可以安全地使用 unbind 解除它,而不使用 Nick Craver 建议的命名函数。 在这种情况下,调用

$('#Inputfield').unbind('keyup');

不会影响document上的处理程序。


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接