jQuery：防止点击队列

$("#right").live("click", function(event) { 
    $(".image_scroll").animate({"left": "+=300px"}, "slow"); 
});

我需要点击才能基本上不注册，直到动画完成。我试过使用return false，但似乎完全杀死链接。jQuery：防止点击队列

也尝试使用$(".image_scroll").stop().animate({"left": "+=300px"}, "slow");但这只是使动画口吃和看起来不好。

编辑：ID #right在图像上，而不是a标记。该HTML如下：

<img src="/images/right.png" id="right" alt="" /> 
<div id="container"> 
    <div id="image_scroll"> 
     <img src="1.jpg" /> 
     <img src="3.jpg" /> 
     <img src="4.jpg" /> 
    </div><!-- /#image_scroll --> 
</div> <!-- /#container

来源

2010-12-14 kylex

您需要提供一个回调动画...

$("#right").live("click", function(event) { 
    event.preventDefault(); 
    var src = $(this).attr('href'); 
    $(".image_scroll").animate({"left": "+=300px"}, "slow", function() { window.location.href = src; }); 
});

来源

2010-12-14 20:22:01

如果不使用'a'链接怎么办？ id #right在图像上 – kylex 2010-12-14 20:56:00

图像上的点击是做什么的？如果您在#right上再次提升点击事件，您如何判断初始点击（您刚刚阻止，以便您可以进行动画制作）和点击动画后触发的点击之间的区别。你可以使用全局标志以非常冒险的方式做到这一点，但为什么不只是执行预期的行为呢？ – 2010-12-15 05:11:01

var handler = function(event) { 
    $("#right").die("click"); 
    $(".image_scroll").animate({"left": "+=300px"}, "slow", function(){ 
     $("#right").live("click", handler); 
    }); 
}; 
$("#right").live("click", handler);

来源

2010-12-14 21:07:53

你需要存储的动画是否正在运行与否，你可以使用jQuery.data功能为：

$("#right").live("click", function(event) { 
    var el = $(this), 
     state = el.data('animation_state'); 
    if(state == 'busy') { 
     //ignore clicks while the animation is running 
     return false; 
    } 
    el.data('animation_state', 'busy'); 
    $(".image_scroll").animate({"left": "+=300px"}, "slow", function() { 
     //finished animating  
     //set the state to finished so we can click the element the next time 
     el.data('animation_state', 'complete'); 
    }); 
});

来源

2010-12-14 21:56:07 nxt

检查动画正在运行，如果是这样，

$("#right").live("click", function(event) { 

    if ($(".image_scroll").is(":animated")) { 
     return false; 
    } 

    $(".image_scroll").animate({"left": "+=300px"}, "slow"); 
});

来源

2015-11-19 23:24:06 Oriol

jQuery：防止点击队列

回答

相关问题