我试图了解如何像http://jqueryui.com/demos/datepicker/
那样构建日期选择器基本上我在文本框的onblur事件中显示“日期弹出窗口”display = none，但当然这不起作用（因为如果用户点击弹出框本身，它将触发模糊事件文本框并隐藏弹出框，这不是我想要的）
我想知道我们如何做到这样当用户点击弹出框以外的任何地方时，弹出框将关闭。
答案 0 :(得分：1)
jQuery UI datepicker是一个非常高级的小部件。 jQuery UI的开发人员有一个名为_checkExternalClick的事件处理程序，它应用于mousedown事件。这个事件处理程序检查了几件事（是打开的datepicker，是被点击的元素的id = =到datepicker的id，datepicker是否有一个markerclass（添加到元素className以指示datepicker附件），datepicker是否有触发类（例如图标触发器）等）。如果一切都通过，则调用_hideDatepicker函数。
以下是jQuery UI datepicker正在执行的操作的简化示例：http://jsfiddle.net/GSzYF/。您可能不需要检查jQuery UI datepicker检查的所有内容，因为您编写的小部件很可能不需要像分布式框架那样可自定义。
答案 1 :(得分：1)
简单的选项是创建一个点击捕获透明div，其z-index小于弹出窗口。将div样式设置为position:fixed;width:100%;height:100%;left:0;top:0，使其包含整个可见屏幕。您可能希望将此附加到body标签的内容中，以便确保它不包含在具有固定或绝对位置的其他内容中。
然后，你需要做的就是将你的关闭处理程序绑定到这个div，当它被点击时你可以拆掉弹出窗口以及div本身。
如果你想获得幻想，你可以使那个div非常不透明，这有助于向用户表明他们的焦点应该放在弹出窗口上。
您的另一个选择是跟踪窗口对象上的mousedown或click事件，将鼠标坐标与弹出窗口的边界框进行比较，并通过关闭弹出窗口并阻止默认事件操作来处理外部点击。坦率地说，这更复杂，容易出错，所以如果它适合你的需要，请选择第一种技术。