我有一个 640x200 的 div，里面有一个隐藏的 200x100 的 div。我的目标是在 640x200 div 悬停时淡入隐藏的 div，然后在退出该 div 时退出。一切正常，但是当我将鼠标悬停在子 div 上时，它会触发下面的悬停功能。
更新我知道当我将鼠标悬停在隐藏的 div 内的元素上时会触发悬停。
我正在使用此代码：
jQuery("#pstsldcon").hover(function() {
jQuery("#slidenav").animate({
opacity: +1
}, 300)
}, function() {
jQuery("#slidenav").animate({
opacity: 0
}, 300)
});
【问题讨论】：
标签： jquery
jQuery(function($) {
$("#pstsldcon").on('mouseenter mouseleave', function(e) {
if ( e.target === this ) {
$("#slidenav").animate({
opacity: (e.type === 'mouseenter' ? 1 : 0)
}, 300);
}
});
});
【讨论】：
您还需要将hover 侦听器附加到隐藏的<div>，并捕获传递给它的Event。这样，您可以防止它冒泡到父 <div>，从而不会触发悬停。
你会想要使用类似的东西：
function(e) {
e.stopPropagation();
}
关于隐藏<div>
【讨论】：
e.preventDefault() 也是出于某种原因。但这实际上不应该做任何不同的事情。您也可以使用孩子的hover 来保持显示。
stopPropagation() 附加到隐藏的<div> 中的所有元素，可能使用> * 选择器。