单击时关闭模态框答案

【问题标题】：Close modalbox on click单击时关闭模态框
【发布时间】：2013-05-21 18:22:24
【问题描述】：

当用户单击后台页面的其余部分时，我想关闭查询 ui 模态框。

我添加了这个 sn-p 来执行此操作，但它不起作用：

$('.ui-widget-overlay').on("click", function() {
    //Close the dialog
    $(this).find(".dialog").dialog("close");
});

Example

【问题讨论】：

请添加页面代码，为什么在查询中使用（this）？
@DoryZidon 只是好奇，但在查询中使用 (this) 有什么问题？我以前用过。但是，如果这会导致我不知道的负面性能，我可能会重新组合我在自己的代码中使用（this）的时间和频率......
this is js 有很多含义..可能很棘手，但我假设 jQuery 为您提供了您单击的元素，但我会在之前对其进行测试..就像提醒 this.tagName 看看会发生什么起来..
.find(".dialog") 我在你的 jsfiddle 标记中找不到类 dialog 的元素。

标签： jquery jquery-ui

【解决方案1】：

$('body').on('click','.ui-widget-overlay', function() {
    $('.ui-dialog').filter(function () {
    return $(this).css("display") === "block";
    }).find('.ui-dialog-content').dialog('close');
});

DEMO

这行得通...找到here

【讨论】：