因此，假设我有一个具有img子元素的父div元素，并且想在父元素悬停时执行一些代码。
<div class="parent">
<img src="link_to_some_image" />
</div>
这里的问题是，当子img悬停时，父“悬停状态”会中断。我如何做到这一点，即使父元素的子元素悬停了，父母也保持其悬停状态？
这是一个jsfiddle示例，请尝试将鼠标悬停在空白处，然后在图像上悬停http://jsfiddle.net/omrf0dxe/
非常感谢！
编辑：img子代是一个示例，它可能是其他类型的元素，例如div，链接等
Edit2：好的，显然解决方案是在绑定“退出”事件时使用mouseleave代替mouseout。
您正在收听事件mouseenter/ mouseout。
您想要事件mouseenter/ mouseleave：
$(".parent").on("mouseenter mouseleave", function () {
$(this).toggleClass('hovered');
});
或者，您也可以添加pointer-events: none到子img元素，以从元素上实质上删除鼠标事件：
.parent > img {
pointer-events: none;
}
但是，根据您要实现的目标，甚至可能不需要JS。
只需使用:hover伪类。
.parent {
width:400px;
height:400px;
background:blue;
}
.parent:hover {
background:red;
}
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句