使用jQuery通過mouseover mouseout寫一個(gè)二級(jí)菜單發(fā)現(xiàn)鼠標(biāo)在一級(jí)菜單的時(shí)候，使用了事件委托，做出來的效果是：能夠顯示二級(jí)菜單，但是鼠標(biāo)移到二級(jí)菜單時(shí)，二級(jí)菜單會(huì)消失，求解答是為什么（我只能想到是因?yàn)閑vent.target變化了，但是此時(shí)的event.target指向哪呢？）。使用事件委托到底能不能實(shí)現(xiàn)這個(gè)功能呢？
下面是我的代碼部分。
HTML代碼如下：
<div>

    <ul class="ul">
        <li class="li1">第一欄
            <ul class="menu">
                <li>ul li1</li>
                <li>ul li2</li>
                <li>ul li3</li>
                <li>ul li4</li>
            </ul>
        </li>
        <li class="li2">第二欄
            <ul class="menu">
                <li>ul li1</li>
                <li>ul li2</li>
                <li>ul li3</li>
                <li>ul li4</li>
            </ul>
        </li>
    </ul>

</div>

JS代碼如下

$(".ul").mouseover(function(e){

    if((e.target.nodeName).toLowerCase() =="li"){
    $(e.target).css("background","orange").children(".menu").css("display","block");
}
})
$(".ul").mouseout(function(e){

// $(this).children(".menu1").css("display","none");

    $(e.target).css("background","lightgrey").children(".menu").css("display","none");
})
我知道其他兩種方法實(shí)現(xiàn)二級(jí)菜單，一種是用css中的hover 實(shí)現(xiàn)，另一種是在JS中去遍歷元素給當(dāng)前元素添加mouseover/mouseout事件來實(shí)現(xiàn)。大家還有其他的方法嗎？