javascript下拉菜单问题

我正试图使用javascript/jquery创建一个下拉菜单，但我无法理解某些东西

当您将鼠标移到菜单项上时，它需要在其下方显示一个div，其中包含另一个菜单，其方式类似于许多javascript菜单

我遇到的问题是，当您将鼠标移出菜单项时，div需要消失，除非您将鼠标移到div上，在这种情况下，div需要保持在那里，直到您将其滚下

问题是菜单项的mouseout事件在div的mouseover事件之前触发

我想我想说的是，只有当你将鼠标移出覆盖菜单和div的区域时，div才会消失

这对任何人都有意义吗？（代码如下）

$（'#menu LI>A'）。鼠标悬停（函数（）{
$（this.find（'dropDownMenu'）.show（）；
});
$（'#menu LI>A'）.mouseout（函数（）{
$（this.find（'dropDownMenu'）.hide（）；
^^^仅当用户尚未转到下拉菜单时才执行此操作。
});

您可以使用代替鼠标盖。

您可以使用代替鼠标盖。

一种解决方案可能是当“#menu LI>a”鼠标出触发时启动超时（当div.onmouseover触发时清除超时）；这样，菜单使用起来也就不那么困难了。

一种解决方案可能是在“#menu LI>a”mouseout触发时启动超时（以及在div.onmouseover触发时clearTimeout）；这样，菜单也就不那么难用了。

真神奇。我以前怎么没注意到？可惜它不起作用。live（）但仍然很好，谢谢。这是魔法。我以前怎么没注意到？可惜它不起作用。live（）但仍然很好，谢谢。

<ul id="menu">
    <li class="item1"><a href="#"></a></li>
    <li class="item2">
        <a href="#"></a>
        <div class="dropDownMenu">
            <div><a href="#">Sub-item 1</a></div>
            <div><a href="#">Sub-item 2</a></div>
            <div><a href="#">Sub-item 3</a></div>
        </div>
    </li>
    <li class="item3"><a href="#"></a></li>
</ul>


$('#menu LI > A').mouseover(function(){

    $(this).find('dropDownMenu').show();

});
$('#menu LI > A').mouseout(function(){

    $(this).find('dropDownMenu').hide();

    ^^^ Only do this if the user hasn't moved on to the drop down menu.

});