jQuery：我需要一个反垃圾邮件在我的功能

Question

我有一个功能，显示一个div在我的导航栏点击时，你可以切换它，所以当你再次按下时隐藏。

问题是，你可以垃圾点击它，所以动画继续并打破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 
    }); 
    }; 

}）;

UPDATE /解决方案

这是我做过什么： 注：这将是与本网站使用的颜色更好，看到的变化。

$("#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; 
     }); 
    } 
});