单击内容时为SlideUp

Question

我有以下代码：

$("a.shownav").on("click", function(){
    $("div.nav").slideToggle();
});

当我单击页面的其他部分（ div.nav部分除外）时，我希望div.nav部分向上滑动。 我已经尝试过了，但是似乎没有用：

if ($("div.nav").is(":visible")){
    $("*").not("div.nav").on("click", function(){
        $("div.nav").slideUp();
    });
}

我如何实现自己想要的？

Answer 1

您可以处理文档的click事件，获取目标对象，然后测试它是导航div还是导航div的子级。 如果不是2之一，则可以将其关闭。

$(document).on("click", function(e){
    var targ = $(e.target);
     if (!targ.hasClass("nav") && targ.parents(".nav").length < 1) {
        $("div.nav").slideUp();
    }
});

DEMO