如何停止jQuery的重複

Question

我使用jQuery的向下滑動列表時mouseenter按鈕

$(".topics .goals").mouseenter(function(){ 
    $(".ligoals").slideDown("slow"); 
}); 

向上滑動時mouseleave

$(document).ready(function(){ 
    $(".topics .goals").mouseleave(function(){ 
    $(".ligoals").slideUp("slow"); 
    }); 
}); 

，但我有問題，所以，當我移動鼠標快速進出按鈕的jquery保持滑落和向上。我想知道有沒有人可以幫忙。

Answer 1

這是因爲mouseenter和mouseleave事件被壓入隊列中。如果你移動速度很快，許多動畫就會排隊，並按照時間順序播放。

您可以使用.stop()來避免此行爲。如下面：

$(document).ready(function(){ 
    $(".topics .goals").mouseleave(function(){ 
    $(".ligoals").stop(true).slideUp("slow"); 
    }); 
    $(".topics .goals").mouseenter(function(){ 
    $(".ligoals").stop(true).slideDown("slow"); 
    }); 
}); 

一般來說例如：

$el.event(function(){     
    $(this).stop(true).animate(...);     
});