jQuery我如何选择多个元素答案

【问题标题】：jQuery how do i select multiple elementsjQuery我如何选择多个元素
【发布时间】：2012-08-18 23:40:28
【问题描述】：

我是 jQuery 新手，我想弄清楚如何为我正在尝试创建的导航栏选择多个元素。我想让它检查用户的鼠标是在导航栏中的项目上还是在下拉菜单上（否则下拉菜单会消失）。我试过使用： $('#nav_item_1').mouseenter(function(){
//make the drop down menu visible and change nav_item background here
});
`

$('#nav_item_1,#dropdown').mouseleave({
    //revert everything back to normal
});

但是当我尝试将鼠标从导航栏中的项目移动到下拉菜单时，它会恢复一切正常。

【问题讨论】：

究竟出了什么问题？考虑提供 jsfiddle 或至少更多代码

标签： events jquery-selectors mouseenter mouseleave

【解决方案1】：

您遇到的问题是，当您离开导航栏项目时，.mouseleave 会立即被触发，同时隐藏 #dropdown。

我在这里要做的是在 nav_item 的 mouseleave 事件上设置一个轻微的超时时间，大约半秒或更短的时间来隐藏下拉菜单。这将允许用户在导航栏之外设置秒数，以便他们可以将鼠标悬停在下拉菜单上。在用户使用#dropdown 后，我将清除超时，防止下拉菜单隐藏的正常行为。

你会如何使用代码来做到这一点？
$('#nav_item_1').mouseleave(function() { /* set your time out here to return everything to normal. Because we want to allow the dropdown to stay visible for a fraction of time required to move the cursor to the dropdown.*/ });

然后，
$('#dropdown').mouseenter(function() { // clear the timer to prevent normal behavior (keeping the dropdown visible). });

查看此链接：http://www.w3schools.com/js/js_timing.asp

关于选择多个项目的原始问题。你正在正确地做这件事。但正如我在上面解释的那样，您的代码没有到达#dropdown 的mouseleave 事件。

【讨论】：

【解决方案2】：

第二段代码使得当您离开#nav_item_1 OR #dropdown 时，所有内容都将被还原。因此，当您离开#nav_item_1 转到#dropdown 时，该事件将触发。

如果当前鼠标目标包含下拉菜单或导航项，您可以检查每个鼠标移动：

$("#nav_item_1").mouseenter(function () {
  // make menu visible etc
}

$(document).mousemove(function (e) { // note the e parameter
  if ($(e.target).has("#dropdown,#nav_item_1").length !== 0) {
    // revert
  }
}

这需要两个元素彼此非常接近才能正常工作。

【讨论】：