jquery - 如何重新绑定(bind)未绑定(bind)的链接/对象

Question

通过按第一个按钮，您将为第二个按钮的 margin-left 设置动画，通过按第二个按钮，您可以解除第一个按钮的点击事件的绑定(bind)，但我想说一个第三个按钮将单击事件绑定(bind)回第一个按钮。

当然是寻找一个简单的解决方案!

代码如下所示:

<div class="button"><a href="http://www.google.com">something</a></div>
<div class="button2"><a href="http://www.google.com">something2</a></div>
<div class="button3"><a href="http://www.google.com">something3</a></div>

​(function(){
    $('.button a').on('click', function(e){
         e.preventDefault();
        $('.button2').animate({'margin-left': '+=2'}, 100);       
    })

    $('.button2').on('click', function(e){
         e.preventDefault();
         $('.button a').unbind('click');       
    })

    $('.button3').on('click', function(e){
         e.preventDefault();
         $('.button a').bind('click');       
    })

})();​

你可以乱搞它 here

Answer 1

您实际上可以在 .on() 中使用命名函数。这意味着您可以定义一个函数 marginFunc()，然后使用

将其绑定(bind)到点击

function marginFunc() {
 ...
}

$(someElement).on('click', marginFunc);

完成后，您可以使用 .unbind('click', marginFunc) 或 .off('click', marginFunc) 解除绑定(bind))。
之后，您可以按照与开始时相同的方式重新绑定(bind)。

Working jsfiddle here .