Javascript 在图像外部单击时隐藏div

我有一个网页有几个隐藏的div。我将它们设置为，当单击图像时，它们将显示，如果再次单击图像，它们将隐藏。问题是，如果它们可见并且页面的任何部分被单击，我需要隐藏它们。我到处寻找，找到了一些建议，但还没有找到一个有效的。有人能帮忙吗

$(window).click(function() {
    $('img').hide();
});

---

我通常绑定文档。单击事件可侦听外部的单击，然后在窗口关闭时将其删除

// in function after your image shows up.
document.click = hideImage;
// other code to hide image when image is clicked

// in function after your image is hidden.
document.click = null;

如果使用jQuery，则更容易，因为您可以为事件命名名称空间，以便安全地添加和删除

// in function after your image shows up.
$(document).bind('click.imagehide', hideImage);
// other code to hide image when image is clicked

// in function after your image is hidden.
$(document).unbind('click.imagehide');

---

此方法更安全，因此不会干扰绑定到

文档的其他单击事件

您需要做的是防止事件冒泡。如果使用jquery，可以执行以下操作：

$(document).on ('click', function () { $('div').hide (); });
$('img').on ('click', function (e) { e.stopPropagation (); });

---

请记住根据您的需要更改选择器。

jsiddle或类似工具，以便我们可以看到您尝试了什么，但许多示例都指向右侧