在没有 jQuery 的情况下悬停父绝对 div 的子元素时，防止出现 onmouseout

javascript dom-events css onmouseout

2022-08-30 01:19:52

我在绝对位置的div中的函数遇到了问题。当鼠标命中 div 中的子元素时，将触发 mouseout 事件，但我不希望它在鼠标离开父级绝对 div 之前触发。onmouseout

如何防止事件在没有 jquery 的情况下命中子元素时触发。mouseout

我知道这与事件冒泡有关，但我没有运气找到如何解决这个问题。

但是，该解决方案使用jQuery。

答案 1

用。onmouseleave

或者，在 jQuery 中，使用mouseleave()

这正是您正在寻找的东西。例：

<div class="outer" onmouseleave="yourFunction()">
    <div class="inner">
    </div>
</div>

或者，在jQuery中：

$(".outer").mouseleave(function(){
    //your code here
});

这里有一个例子。

答案 2

对于在大多数情况下有效的更简单的纯CSS解决方案，可以通过将儿童的指针事件设置为none

.parent * {
     pointer-events: none;
}

浏览器支持：IE11+