Jquery:点击slideUp Issue

Question

我有一个JQuery导航，单击一个父<li>就可以使用JQuery向下滑动。在第二次点击时，它会将导航向上滑动。我的问题是，我的客户希望如果他点击屏幕上的其他地方，它也会滑动回来，也就是说，只要点击空白区域就会折叠导航。

有什么想法吗？

下面是Jquery：

$('#menu-flag-menu > li > a').click(function(e) {e.preventDefault();});


$("#menu-flag-menu li a").click(function(){ 

    // close all opened sub menus
    $("ul", $(this).parent().siblings()).stop(true,true).slideUp();

    var ul = $(this).next("ul");     
    ul.stop(true,true).slideToggle('fast'); 
});

Answer 1

这应该是可行的：

$(document).click(function (e) {

    // if we click on anything other than the navigation menu
    // or it's descendants then slide up the menu
    if(e.target.id !== "menu-flag-menu" 
        && !$(e.target).closest("#menu-flag-menu").length) {
        $(".sub-menu").stop().slideUp();
    }
});

Answer 2

我的建议是尝试使用.mouseenter事件打开菜单，使用mouseleave事件关闭菜单。