在再次運行之前強制onClick動畫完全完成

Question

我有一個滑塊，通過在單擊按鈕時增加和減少邊距來控制位置。如果您在動畫完成之前再次單擊該按鈕，則會從任何位置開始，導致定位不正確。 說第一次點擊應該將它移動100px，但在完成之前再次單擊它（例如，當它移動50px時），結果是它移動了150px，而不是完成100px移動，然後再次移動到200px。

這是我的代碼;

$('#button').click(function (e) { 
    e.preventDefault(); 
    $('#toMove').animate({ 
     marginTop: topMargin 
    }, 1000); 
}); 

TopMargin在代碼中設置爲較高的var。

我遇到過stop（）和queue（），但我不確定是否正確使用它們，因爲我無法讓它們工作。

Answer 1

$('#button').click(function (e) { 
e.preventDefault(); 
$('#toMove').animate({ 
    marginTop: topMargin, 
    complete: function() { 
       $(this).css('margin-top','0px'); 
      } 
}, 1000); 
});