是.unbind()。click(function(){...})一个好习惯?

时间:2012-08-21 07:30:05

标签: javascript jquery javascript-events

我在谈论以下内容:

.unbind().click(function () {
    // Do something
}

对我来说看起来有点狡猾,但它有道理:开发人员想先删除绑定到该元素的任何事件,然后绑定一个click事件。

这个问题有更好的解决方案吗?或者纠正我的思维方式。

5 个答案:

答案 0 :(得分:8)

这不是很好的练习,因为您无法控制哪些点击事件未被绑定。有两种不同的方法可以改善这种情况:


使用事件命名空间(更快)

您可以使用命名空间控制解除绑定再次绑定的click事件:

$(selector).off('click.namespace').on('click.namespace', function(e) { //...


使用班级(最快)

使用添加到链接的类将其标记为已注册(这不会取消绑定先前绑定的事件,但它有助于防止多个事件绑定,这在大多数情况下会使用off(解除绑定)之前的问题on(绑定):

$(selector).not('.registered').addClass('registered').on('click', function(e) { //...

你甚至可以把它变成一个性感的插件,写作:

$.fn.register = function(register_class) {
  register_class || (register_class = 'registered'); // lets you control the class
  return this.not('.' + register_class).addClass(register_class);
};

像这样,你可以在每个选择器上调用register

$(selector).register().on('click', function(e) { //...

或者使用特定课程,如果选择“已注册”:

$(selector).register('special_handler_registered').on('click', function(e) { //...


性能

如果您想知道不同处理程序的性能:

<强> Check out this performance test here

答案 1 :(得分:2)

每当我不得不“更新”一些按钮,链接等行为时,我就会采用这种方法,而且我认为它没有任何问题。 但请注意,使用您的代码,您将删除附加到元素的每个处理程序。所以,相反:

$(selector).unbind('click').click(function(){
    // do something
})

答案 2 :(得分:1)

嗯,至少最好指定哪些事件处理程序应该解除绑定。因此,如果有一些点击事件hendler并且我们只想取消绑定它,那么我们可以使用unbind('click')

答案 3 :(得分:1)

由于除了你的处理程序之外还可以有其他处理程序,因此使用名称空间是有意义的。

$(selector).off('click.myns').on('click.myns', function() {....})

or 

$(selector).unbind('click.myns').bind('click.myns',function() {...})

这样你只会触及自己的处理程序而不是其他一些处理程序,例如jquery插件添加

答案 4 :(得分:1)

我通常尝试尽可能使用命名事件函数,以便能够明确地取消绑定它们:

$('a').unbind('click.myfunc').bind('click.myfunc', function(evt) { ... });

通过这种方式,您可以将此绑定添加到可以多次执行的init函数中(对于无论出于何种原因无法使用委托的情况,都很方便)。

一般情况下,如果我不需要,我不会试图解除每个事件甚至某个事件的每个处理程序的绑定。

我也试图保持最新状态并用开/关替换所有绑定/取消绑定调用; - )