通过按第一个按钮,可以对第二个按钮的margin-left
进行动画处理,通过按第二个按钮,可以将第一个按钮的点击事件解除绑定,但是我想说第三个按钮,将点击事件绑定回第一。
寻找一个简单的解决方案!
代码如下所示:
<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
最佳答案
您实际上可以在.on()
中使用命名函数。这意味着您可以定义一个函数marginFunc()
,然后使用将其绑定到点击
function marginFunc() {
...
}
$(someElement).on('click', marginFunc);
然后,一旦完成,就可以使用
.unbind('click', marginFunc)
或.off('click', marginFunc)
解除绑定。之后,您可以按照与开始时相同的方式进行重新绑定。
Working jsfiddle here。