jQuery:如果在其他地方检测到单击，则隐藏弹出窗口

Question

如果用户单击弹出窗口或其子窗口之外的任何位置，我会尝试隐藏 div。这是我到目前为止的代码:

$("body").click(function(){
    var $target = $(event.target);
    if(!$target.is(".popup") || !$target.is(".popup").children()){
        $("body").find(".popup").fadeOut().removeClass('active');
    }
});

这适用于 .popup div，但如果单击其任何子级，它仍然会隐藏它。

Answer 1

我认为你真的可以简化一下:

// If an event gets to the body
$("body").click(function(){
  $(".popup").fadeOut().removeClass("active");
});

// Prevent events from getting pass .popup
$(".popup").click(function(e){
  e.stopPropagation();
});

单击弹出窗口或其任何子窗口将导致传播在到达主体之前停止。

停止事件传播的演示:http://jsbin.com/ofeso3/edit