javascript - 当用户单击文档中的任意位置时淡出弹出窗口

Question

我需要的是当弹出窗口出现并且用户单击文档中除弹出窗口之外的任何位置时，弹出窗口应该淡出。

我已经尝试过使用 target.attr 方法，但在 Mozilla 中失败了。

有什么想法吗？提前致谢

Answer 1

您可以使用jQuery淡出方法和一种方法。

就像是 ：

jQuery("#yourpoup").click(function(){ return false; });
jQuery(document).one("click", function() { jQuery("#yourpoup").fadeOut(); });

根据这个问题，使用 this 比使用 bind 更好。

Answer 2

还有一个用于点击外部的 JQuery 插件，这将允许您处理除了弹出窗口之外的所有内容的点击。

http://benalman.com/projects/jquery-outside-events-plugin/

$("#yourpopup").bind( "clickoutside", function(event){
$(this).fadeOut(500);
});

Answer 3

如果您的弹出窗口是一个 JQuery 对话框，您可以看到这个线程：

jQuery UI - 在外部单击时关闭对话框

Answer 4

以 jquery 为例，假设$popup是您的弹出元素

$('body').click(function(){
    // hide the popup here
});

$popup.click(function(e) {
    // do something here if needed
    e.stopPropagation();
});

关键是在弹出窗口中单击时，停止将事件冒泡到正文，因此不会触发附加到正文的函数。