jQuery:我的函数需要一个反垃圾邮件

Question

我有一个函数，当点击时会在导航中显示一个div，你可以切换它，所以当你再次按下它时它会隐藏起来。

问题是，你可以垃圾邮件点击它，这样动画就可以继续播放并打破分区

我需要的是某种反垃圾邮件点击，我希望它等到第一个动画完成。

这是代码：

$("#navDown").click(function(){
if($("#navExpand").height()===0){
    $('#navArrow').animateRotate(0, -180);
    $("#navExpand").animate({
        height: 150
    })
    $(".navExCon").delay(300).fadeToggle(150);
    }
else if($("#navExpand").height()===150)
    {
$(".navExCon").fadeToggle(150);
    $('#navArrow').animateRotate(180, 0);
    $("#navExpand").delay(300).animate({
        height: 0
    });
    };

})；

更新/解决方案

我就是这么做的：注意：最好在这个网站上使用颜色，看看变化。

$("#navDown").click("slow",function(){ // added time "slow": 600 u i think.
  if($("#navExpand").height()===0){
    $('#navArrow').animateRotate(0, -180);
    $("#navExpand").animate({
        height: 150
    },200)                    // added some time
    $(".navExCon").fadeToggle(100);
    }
    else if($("#navExpand").height()===150)
    {
    $(".navExCon").fadeToggle(250);
    $('#navArrow').animateRotate(180, 0);
    $("#navExpand").animate({
        height: 0
    },200);                  // added some time
    };
});

Answer 1

当动画完成时，您可以有一个回调函数：

var animating = false;
$("#navDown").click(function(){
    if (animating) {
        return; // Don't start new animation
    }
    animating = true;
    if($("#navExpand").height()===0){
        $('#navArrow').animateRotate(0, -180);
        $("#navExpand").animate({
            height: 150
        })
        $(".navExCon").delay(300).fadeToggle(150, function() {
            // Will be called after animation is finished
            animating = false;
        });
    }
    else if($("#navExpand").height()===150)
    {
        $(".navExCon").fadeToggle(150);
        $('#navArrow').animateRotate(180, 0);
        $("#navExpand").delay(300).animate({
            height: 0
        }, function() {
            // Will be called after animation is finished
            animating = false;
        });
    }
});