防止事件（這）元素一樣

Question

幾個指定的HTML文章：

<article id="someId" class="some_wrapper"> 
    <section class="info_wrapper"> 
     <section class="info"> 
      <p>Content</p> 
     </section> 
    </section> 
</article> 

Cobined一些基本的jQuery的，如：

$(".some_wrapper").mouseenter(function(){ 
    $(this).find(".info").fadeIn(500); 
}); 

$(".some_wrapper").mouseleave(function(){ 
    $(this).find(".info").fadeOut(500); 
}); 

問題：如果用戶移動鼠標快速severel倍從.some_wrapper到另一個，事件處理程序多次觸發並建立隊列fadeIn()和​​的效果。即使老鼠已經站在集裝箱外面，只要經常發生這種情況，這些情況就會發生。

如何防止和mouseleave()上的$(this)元素，其中.info可見。或者打破隊列？

感謝。

Answer 1

您需要觸發淡入或拔出事件

$(".some_wrapper").mouseenter(function(){ 
    $(this).find(".info").stop().fadeOut(500); 
    $(this).find(".info").fadeIn(500); 
}); 

$(".some_wrapper").mouseleave(function(){ 
    $(this).find(".info").stop().fadeIn(500); 
    $(this).find(".info").fadeOut(500); 
}); 

這將停止所有先前觸發的事件，並執行最新event.So repeatation不發生使用stop（）函數。

Answer 2

$(".some_wrapper").mouseenter(function(){ 
    if($(this).find(".info").is(":visible") === true) { 
     $(this).find(".info").fadeIn(500); 
    } 
}); 

$(".some_wrapper").mouseleave(function(){ 
    if($(this).find(".info").is(":visible") === false) { 
     $(this).find(".info").fadeOut(500); 
    } 
});