當鼠標移至內部元素時丟失鼠標移動

Question

我有如下所示的示例。如何避免<div>鼠標結束內部<span>「失去鼠標懸停」？

<div id="box"> 
    ABC 
    <span style="font-size: 10px; font-weight: normal;">abc</span> 
</div> 

現場演示here。

Answer 1

使用jquery懸停代替mouseenter/mouseout例如

$('#box').hover(function(){ 
    //Enter code 
}, 
function(){ 
    //Exit code 
}); 

正如另一個用戶提到的那樣，您可以使用mousenter和鼠標離開的鏈接事件，例如，

$(selector).mouseenter(handlerIn).mouseleave(handlerOut); 

但是，懸停只是上述的簡寫。

Answer 2

切換到mouseenter & mouseleave; http://jsfiddle.net/alexk/PjhmC/3/

的mouseenter事件從鼠標懸停在不同它處理 事件冒泡的方式。如果鼠標懸停在此例子中所使用的，那麼當 鼠標指針移動經過內部元件，該處理程序是 觸發