jQuery的：鼠標懸停/的mouseenter與委託

Question

我有這樣的代碼：

<!-- language: lang-js --> 

$('#trajectory-sequence').delegate('li:not(.disabled)','mouseenter mouseleave', function(event) 
{ 
    if(event.type == 'mouseenter') 
     $(this).find("div:gt(0)").show(); 
    else if(event.type=='mouseleave') 
     $(this).find("div:gt(0)").hide(); 
}); 

，顯示/隱藏了一些兒童。現在，我想在鼠標結束其中一個孩子時執行一個動作。我有這個：

<!-- language: lang-js --> 

$('#trajectory-sequence').delegate('li:not(.disabled) div:nth-child(4)','mouseover', 
function() { 
    alert('mouseover'); 
}); 

但似乎mouseover事件從未觸發。但是當我使用mouseenter而不是mouseover時，它完美地工作，爲什麼？

Answer 1

mouseenter事件與mouseover處理事件冒泡的方式不同。

由於mouseover事件，如果鼠標指針移到Inner元素上，處理程序將被觸發。這通常是不受歡迎的行爲。另一方面，mouseenter事件只在鼠標進入綁定的元素時觸發其處理程序，而不是後代。所以mouseenter的作品。