我相信您应该能够添加一个.stop()，它会为您处理这些问题：

onmouseover: function() { 
    this.find('.details', this).stop().slideDown(); 
},
onmouseout: function() { 
    this.find('.details', this).stop().slideUp(); 
}

你真正想要的答案是所有其他三个答案的组合。

$("...").hover(function() {
  $(this).stop(true, true).slideDown();
}, function() {
  $(this).stop(true, true).slideUp();
});

您希望在stop中使用true，因为它们会清除挂起的动画队列。如果不使用这些，您会发现快速重复地在元素上移动鼠标会产生错误的结果。

一般来说，在启动这样的动画时需要调用stop()：

$("...").hover(function() {
  $(this).stop().slideDown();
}, function() {
  $(this).stop().slideUp();
});

这应该足以避免长时间运行动画队列。
还可以使用$.clearQueue()全局清除尚未开始的动画。
此外，如果您在mouseover()和mouseout()上设置这些事件，那么可以说使用hover()事件会更清楚。

如果你把参数放在stop()中也会更好，就像这样：一米一米一

在我的例子中，我也在寻找一个.stop()的解决方案来解决大量的上下动画队列，但是，它仍然没有解决，因为它不平滑，而且有bug，使它不能再向下滑动了。
因此，我提供了一个与取消队列无关的解决方案，但它可能会对你们中的一些人有所帮助。这个解决方案是关于在动画目标当前没有被动画化时将其上下滑动。

$("#trigger").on({
    mouseover: function() {
        $("#animationTarget").not(":animated").slideDown();
    },
    mouseleave: function() {
        $("#animationTarget").not(":animated").slideUp();
    }
});

您可以执行以下操作：http://jsfiddle.net/3o2bsxo6/3/

脚本语言

$('h5').each(function(){
    $(this).unbind('mouseover'); //unbind previous events (prevent repeats)
    $(this).unbind('mouseout');

    $(this).on('mouseover',function(){
        if(!$(this).next('.details').is(':visible')){ //if not visible
             $(this).next('.details').slideDown();   //slidedown                        
        }
    })  
    $(this).on('mouseout',function(){
        if($(this).next('.details').is(':visible')){ //if visible
             $(this).next('.details').slideUp();    //slideup                           
        }
    })      
})

网页：

<h5>Hover To Slide</h5>
<p class="details">
However, when the user quickly moves the mouse over these interface elements the animations can't keep up and the items will be sliding up and down long after the mouse has left the interface area.    
</p>
<h5>Hover To Slide</h5>
<p class="details">
However, when the user quickly moves the mouse over these interface elements the animations can't keep up and the items will be sliding up and down long after the mouse has left the interface area.    
</p>
<h5>Hover To Slide</h5>
<p>
However, when the user quickly moves the mouse over these interface elements the animations can't keep up and the items will be sliding up and down long after the mouse has left the interface area.    
</p>

中央支助组：

p{
    display:none;
}

此线程中发布了类似的查询。使用
stop（true，false）你可以达到没有bug的效果。

$('#YourDiv').on('mouseenter', function(){
   $(this).next().slideDown(250).stop(true, false).slideDown()  
});

我假设在**#YourDiv**之后有一个元素，您希望将其放入上滑和下滑动画。
这将跳转到最后一个事件的动画，并清除链中所有挂起的事件。