这是我对这个问题找到的最简单的答案：

window.addEventListener('click', close_window = function () {
  if(event.target !== windowEl){
    windowEl.style.display = "none";
    window.removeEventListener('click', close_window, false);
  }
});

您将看到我将函数命名为“close_window”，以便在窗口关闭时删除事件侦听器。

Use:

var go = false;
$(document).click(function(){
    if(go){
        $('#divID').hide();
        go = false;
    }
})

$("#divID").mouseover(function(){
    go = false;
});

$("#divID").mouseout(function (){
    go = true;
});

$("btnID").click( function(){
    if($("#divID:visible").length==1)
        $("#divID").hide(); // Toggle
    $("#divID").show();
});

这是我解决问题的方法。

$(window).click(function (event) {
    //To improve performance add a checklike 
    //if(myElement.isClosed) return;
    var isClickedElementChildOfMyBox = isChildOfElement(event,'#id-of-my-element');

    if (isClickedElementChildOfMyBox)
        return;

    //your code to hide the element 
});

var isChildOfElement = function (event, selector) {
    if (event.originalEvent.path) {
        return event.originalEvent.path[0].closest(selector) !== null;
    }

    return event.originalEvent.originalTarget.closest(selector) !== null;
}

现在有一个插件：外部事件（博客文章）

当clickoutside处理程序（WLOG）绑定到元素时，会发生以下情况：

元素被添加到一个数组中，该数组包含所有具有clickoutside处理程序的元素（名称空间）单击处理程序绑定到文档（如果尚未存在）在文档中的任何单击时，都会为该数组中不等于或不是单击事件目标的父级的元素触发单击外部事件此外，clickoutside事件的event.target设置为用户单击的元素（因此您甚至可以知道用户单击了什么，而不仅仅是他在外面单击了什么）

因此，不会阻止任何事件的传播，并且可以在元素的“上方”使用额外的单击处理程序和外部处理程序。

$(document).click(function() {
    $(".overlay-window").hide();
});
$(".overlay-window").click(function() {
    return false;
});

如果单击文档，则隐藏给定元素，除非单击同一元素。

我有一个应用程序，它的工作方式与Eran的示例类似，只是当我打开菜单时，我会将单击事件附加到主体。。。有点像这样：

$('#menucontainer').click(function(event) {
  $('html').one('click',function() {
    // Hide the menus
  });

  event.stopPropagation();
});

有关jQuery的one（）函数的更多信息