jQuery悬停在父级而不是子级上答案

【问题标题】：jQuery hover over parent but not childrenjQuery悬停在父级而不是子级上
【发布时间】：2011-11-01 17:49:57
【问题描述】：

无论如何使用 jQuery 与 DOM 进行交互，当用户将鼠标悬停在 div 上时会出现一个菜单，但是当他们将鼠标悬停在该父级内的特定子元素上时，什么都没有发生？

到目前为止的代码

$('#player_area:not(< #player_links)').live("mouseenter", function() {
  return $('#album_tracks').slideDown(200);
}).live("mouseleave", function() {
  return $('#album_tracks').hide();
});

【问题讨论】：

请创建一个jsfiddle.net 演示。 mouseenter 和 mouseleave 应该像你想要的那样工作。
这里是 jsfiddle：jsfiddle.net/q4beS/2
嗯，当我删除 < 时，它似乎可以工作（< 无论如何都不是有效的选择器）。这是你想要的吗？ jsfiddle.net/q4beS/4

标签： jquery jquery-selectors

【解决方案1】：

这是您需要的：http://api.jquery.com/mouseover/

mouseenter 和 mouseleave 方法。

查看示例演示；）

【讨论】：

【解决方案2】：

问题是是否因为您不希望在子项上使用 mouseenter 事件重复该操作。也就是说，事件已经由父级触发，并且您不希望在不先离开父级的情况下再次执行它，或者您是否希望子级不触发 mouseenter（如果它已定位在父级之外）。

如果您仅删除 :not 选择器，您的代码似乎应该可以工作。

编辑...抱歉误解了...以下小提琴应该解决您需要做的事情

http://jsfiddle.net/q4beS/6/

【讨论】：

回答您的问题；是的，我只希望该操作直接在父级上发生，如果鼠标“进入”或“悬停”在父级中的子级上，则没有任何反应，或者如果专辑轨道 div 可见，则隐藏 div
我最终简化了几乎所有的代码。我能够利用为父悬停事件准备的另一个 div 类。我只是将孩子与父母分开并重新定位所有东西，一切都很好:)