使用jquery显示/隐藏菜单

这是一个菜单的css

<span id="menu2">Menu 2</span>

子菜单

<div id="submenu">
                        <div id="submenu1">submenu1</div>
                        <div id="submenu2">submenu2</div>
</div>

当鼠标位于menu2$（“#子菜单”）上时显示，当鼠标离开$（“#子菜单”）时，$（“#子菜单”）隐藏。现在这很好，问题是当鼠标离开菜单2时，鼠标是否进入子菜单#菜单2应该隐藏

我不能在#菜单2和#子菜单上同时使用mouseleave，我该怎么做

谢谢

---

Jean

尝试使用插件，不要发明自行车：

---

我不确定我是否理解你的问题，但我会让你知道我在这种情况下通常会做什么

// First I block the event from bubbling up to the document
$("#menu2, #submenu").mouveover(function(ev) { ev.stopPropagation(); } 

// Then, when entering the #menu2, show the #submenu, but also install a listener
// for the rest of the document to hide the #submenu.
$("#menu2").mouseenter(function() {
  // Going back from submenu to menu should do nothing (make sure to not leave a gap)
  var submenu = $("#submenu:hidden");
  if (submenu.length > 0) {
    submenu.show(); // Only if it's hidden
    $(document).one("mouseover", function() {
      submenu.hide();
    });
  }
});

---

试试这个…我希望它会有帮助，它是一个用于隐藏数据的jquery插件。。

$('#menu2').mouseover(function(){
                $('#submenu').show();
                });



$('#submenu').mouseleave(function(){
                    $('#submenu').hide();
                    });

// First I block the event from bubbling up to the document
$("#menu2, #submenu").mouveover(function(ev) { ev.stopPropagation(); } 

// Then, when entering the #menu2, show the #submenu, but also install a listener
// for the rest of the document to hide the #submenu.
$("#menu2").mouseenter(function() {
  // Going back from submenu to menu should do nothing (make sure to not leave a gap)
  var submenu = $("#submenu:hidden");
  if (submenu.length > 0) {
    submenu.show(); // Only if it's hidden
    $(document).one("mouseover", function() {
      submenu.hide();
    });
  }
});