从绝对定位的元素冒泡的鼠标事件

Mouse events bubbling from an absolute-positioned element

本文关键字:鼠标 事件 元素 定位      更新时间:2023-09-26

我有这个:

<div id="parent">
    <div id="child">
        &nbsp;
    </div>
</div>
$(document).ready(function() {
    $('#parent').on('mouseout', function() {
        alert('Mouse out!');
    });
});

http://jsfiddle.net/aYGBC/2/

现在,当我将鼠标移到蓝色块上并将其移出某个地方时,一切都很好。但是当我将鼠标移到蓝色块上,然后在红色块上移动时,也会触发mouseout事件。为什么会发生这种情况,如何使mouseout事件仅在我实际将鼠标移出块时才发生?

使用 mouseleave ,它"当鼠标或其他指针设备离开提供给元素及其所有后代的物理空间时调度":

$(document).ready(function() {
    $('#parent').on('mouseleave', function() {
        alert('Mouse out!');
    });
});