如何在JQuery中绑定、解除绑定和重新绑定(单击)事件?

After asking the same question 2 weeks ago here, I finally found "the" solution. This is why I am answering my own question. ;)

在两周前问了同样的问题之后，我终于找到了“解决方案”。这就是为什么我要回答我自己的问题。,)

HOW TO BIND, UNBIND AND REBIND EVENTS IN JQUERY?

如何在JQUERY中绑定、解绑定和重新绑定事件?

3 个解决方案

#1

And THIS is the perfect solution. (At least for me.)

这是一个完美的解。(至少对我来说)。

$(document).on('click', 'a#button', function(){
    $(this).after('<span> hello</span>');
    $('span').fadeOut(1000);
});

$('a#toggle').toggle(
    function(){
        $(this).text('rebind');
        $('a#button').on('click.disabled', false);
    },
    function(){
        $(this).text('unbind');
        $('a#button').off('click.disabled');
    }
);

".on()" does it. NOTE: It is important to bind the event like you can see on line one! It does not work with .click() or …!

内用()。注意:像你在第一行中看到的那样绑定事件是很重要的!它与.click()或…!

See the docs!

看医生!

Here is a fiddle to try it and experiment with it!

这是一个尝试和实验的小提琴!

Enjoy!

享受吧!

#2

A simpler and short solution is to add a class to the object if you want to unbind it then remove this class to rebind ex;

一个简单而简单的解决方案是，如果您想要解除绑定，则将一个类添加到对象中，然后删除该类以重新绑定;

$('#button').click( function(){
   if($(this).hasClass('unbinded')) return;
   //Do somthing
 });

$('#toggle').click(function(){
    $('#button').toggleClass('unbinded');
 });

#3

-1

This function extends jQuery to include an operator that attaches event handlers the same as .on. Additionally it prevents more than a single instance of a given handler from being attached to the selector(s).

这个函数扩展了jQuery，使其包含与.on相同的事件处理程序的操作符。此外，它还防止了一个给定处理程序的单个实例被附加到选择器(s)。

Be aware that removing and reattaching event handlers changes the order that they are attached.

请注意，删除和重新附加事件处理程序将更改它们所连接的顺序。

(function ($) {
    $.fn.reBind = function(events, handler) {
        return this.off(events, handler).on(events, handler);
    };
}(jQuery));

#1