JS Dropdown菜单没有关闭?

时间:2013-10-24 08:43:34

标签: javascript html menu

所以我在这里找到了这个小提琴:http://jsfiddle.net/8qPvp/4/ 我以为我只是出于个人教育目的而使用它。 我是JS的新手,我注意到打开的父级不会再次点击,就像它打开一样。怎么能修好?

$(document).ready(function () {
    $("li").click(function () {
        $('li > ul').hide();
        $(this).children("ul").toggle();
    });
});

2 个答案:

答案 0 :(得分:1)

$(document).ready(function () {
    $("li").click(function () {
        $('li > ul').hide();
        $(this).children("ul").toggle();
    }).mouseleave(function(){
        $(this).children("ul").hide();
    });
});

检查这个小提琴http://jsfiddle.net/Aveendra/8qPvp/18/

答案 1 :(得分:1)

这个怎么样:

$("li").click(function () {
    $('li > ul').hide();
    $(this).children("ul").toggle();
});

$(document).click(function()
{
    $('li > ul:visible').hide();
})

$('.menu li').click(function(e)
{
    e.stopPropagation();          
})

因此,默认情况下,只要在文档中单击任何地方,我就会生成您的可见菜单。但是,当您打开一个新菜单时,您不希望发生这种情况(将会显示为可见并直接隐藏)。所以当你想要打开一个新菜单并且我将取消文档点击事件时,我会抓住一个例外。
我使用event.stopPropagation()来取消活动。

<强> jsFiddle

相关问题