javascript - 如何确定实际悬停的是哪个元素

Question

很多JS我都不懂。虽然我已经做了自己的搜索，但我找不到答案。所以我在这里问，希望你能帮助我。

我正在尝试基于 div 标签(如 http://www.adobe.com/ )创建一个导航菜单，并使用 jQuery 来实现“悬停时出现/消失”的功能。

简单的 Div 结构:

<div id='menu'>
    <div> Level 1 a
            <div> Level 2 a </div> 
            <div> Level 2 b </div> 
    </div>
    <div> Level 1 b
            <div> Level 2 c </div> 
            <div> Level 2 d </div> 
    </div>
</div>

我知道它需要使用 $('#menu').hover() 函数。我的问题是，如果只使用一个 id“菜单”，我可以如何或使用什么样的功能来确定哪个实际菜单列表正在悬停？

喜欢:

$("#menu").hover(                        // Div Menu is being hovered
    function () {
        // $el = Determine which menu inside of Div Menu is actually being hovered
        // $el.show();
    },
    function () {
        $el..hide();
    }
);

或者我的结构完全错误，应该使用另一种方法来做到这一点？请帮忙。

Answer 1

$("#menu").hover(                        // Div Menu is being hovered
    function (event) {
        $el = $(event.target);
        $el.show();
    },
    function (event) {
        $el = $(event.target);
        $el.hide();
    }
);