2

我有一个匿名函数处理一组单选按钮上的单击事件之后的过程。

在这个函数中会发生一些动画，我希望在函数结束之前禁用点击事件，以防止它在函数内再次触发。

该函数调用每个单选按钮通用的类名：

$(".question1").click( function(){

如何在函数执行任何动画时禁用此类元素上的任何进一步单击事件，并在它们完成后恢复它？

我已经尝试过 removeClass() 和 addClass() 来实现这一点，但它似乎在函数中不起作用。

我也尝试过 .off() 和 .on() ，但没有成功。

单选按钮本身在函数中被禁用，但是因为函数是在类名上调用的，所以仍然会触发 click 事件。

非常感谢。

4

3 回答 3

0

我会走另一条路，如果元素正在被动画化，我会检查点击处理程序，在这种情况下只是返回，因为你必须使用:animated选择器，如下所示：

$(".question1").click( function(){
   if ( $('#element').is(':animated') ) {
      return;
   }
   //rest of code
});
于 2012-10-24T22:41:26.597 回答
0

您可以禁用单击按钮，然后在动画完成后重新启用它。

$(".question1").click( function(){ 
   var that = this; 
 $(this).attr('disabled','disabled');
 $('.anim_div').animate({
    opacity: 0.25,
    left: '+=50',
    height: 'toggle'
   }, 5000, function() {
        $(that).attr('disabled',false);
 });
});

http://api.jquery.com/animate/

对于多个动画，您可以考虑使用 deferreds 来检测所有动画何时完成。

于 2012-10-24T23:19:28.747 回答
0

一定是出了什么问题……开/关功能很好用，还有类选择器。

你能放一些代码吗？给作为一个小提琴，所以我们可以尝试提供帮助。

如果您不能给我们代码，我会尝试：

// triggered only if the class is not disable
$(".question1:not(:disabled)").on('click', function(){
    // do something...
});

或者

function theClick(){
    $(".question1").on('click', function(){
        // do something...
    });
}
function theAnimation(){
    $("#someId").on('click', function(){
        $(".question1").off('click'); // disable the click
        // do some animation
        // do more...
        // and more...
        theClick(); // finish, so re-enable
    });
}
于 2012-10-26T19:19:59.383 回答