当我点击外面时如何让这个弹出框消失？ [英] How do I make this popup box disappear when I click outside?

问题描述

http://jsfiddle.net/mnbayazit/by3zy/2/

当我点击背景上的某个地方时，我希望弹出窗口消失。问题是，当我点击[X]或弹出窗口时，它会消失。

I want the popup to disappear when I click somewhere on the background. Problem is, it disappears when I click an [X] or the popup itself.

想象一下，如果这样可以让我的意图更清晰，那么它就是一个日历选择器。

Imagine it being a calendar-picker if that makes my intentions more clear.

我怎样才能做到这一点？

How can I get it to do that?

推荐答案

1. 为正文设置一个点击处理程序以删除弹出框。

1. Set a click handler for the body to remove your popup.

设置一个点击处理程序，弹出一个在事件上调用 stopPropagation（）的弹出窗口，以防止它冒泡到身体。

Set a click handler for the popup itself that calls stopPropagation() on the event, to prevent it from bubbling up to the body.

大致：

function showMyPopup(){
  ...
  $(myPopupDiv).click(function(e){
    e.stopPropagation();
  });
}
function closeMyPopup(){
  ...
}
$(document.body).click(closeMyPopup);

这篇关于当我点击外面时如何让这个弹出框消失？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！