為什么javaScript / jQuery在事件冒泡時似乎忽略了我的IF語句？

Question

我敢肯定，只是我沒有正確理解JavaScript基礎。 但是有人能指出為什么為什么在事件冒泡時我的if語句的評估結果為true，即使if語句中的語句的評估結果為false嗎？

當我一次按html <a>標記時，if（sFormula> 168）似乎可以按預期工作，但是如果我快速單擊它，一切似乎都變得瘋狂了。

這是一個帶有代碼的jsFiddle： http : //jsfiddle.net/twimB/pGHrP/ ，下面僅是其中的一小段。

如果有人可以花時間解釋，我將不勝感激。

謝謝。

HTML

<a href="#" id="right">&raquo;</a>

jQuery的

$("#right").click(function(event){
    event.stopImmediatePropagation();
    if(busy == false){
        busy = true ;
        var parentMargin = $(".wrap").offset().left;
        var parentWidth = $(".wrap").width();
        var carouselMargin = $(".block").offset().left;
        var carouselWidth = $(".block").width();
        var rFormula = carouselWidth - ((parentMargin - carouselMargin) + parentWidth);
        $(".pLeft").text("");
        $(".pRight").text("if ( rFormula > 0 ) {perform slide} fFormula is: " + rFormula);
        if(rFormula > 168){
            $(".block").animate({"left": "-=168px"}, "slow");
        }
        busy = false ;
    }
});

Answer 1

.animate()方法不會停止腳本執行。 發生的情況是它開始動畫並且腳本執行繼續，並且busy立即設置為false。

您需要的是僅在動畫完成后使用回調函數設置標志：

if(rFormula > 168){
    busy = true;
    $(".block").animate({"left": "-=168px"}, "slow", function() { busy = false });
}

（請注意，我還將標記的設置移到了這里，因為在動畫開始之前對其進行設置沒有任何好處。）

演示： http : //jsfiddle.net/pGHrP/1/ （我只更新了右鍵）。