jQueryUI——一种关闭模式对话框的方法，可以多次运行

我有一个模态对话框。我想通过在对话框窗口外单击来关闭它

这里和Google上有许多答案建议在jQuery对话框函数中执行此操作：

open: function(event,ui) {
                    $('.ui-widget-overlay').on('click', function(event,ui) {
                        alert("closing");        
                        $("#dialog-message").dialog("close");
                    });
                }

然而，这对我来说只有一次效果。如果我再次打开对话框，我的警报将关闭，但对话框不再关闭

我可以通过在脚本的开头添加此选项来解决此问题，脚本将关闭所有对话框：

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

然而，我想弄清这一点，并理解为什么每个人的答案似乎对他们有效，但对我无效。我在JSFIDLE中看到过一些很好的例子，它们似乎执行完全相同的代码

解决方案：

我的错误是，当我进行对话（“关闭”）时，我会破坏对话，然后必须创建一个新的对话。当然，在realty对话框中（“关闭”）仅隐藏对话框。因此，我一直在向DOM中添加具有相同id的div。这显然造成了问题

---

解决方案是添加一次div，创建一次dialog函数，设置autoOpen:false，然后在需要时通过dialog（“open”）函数调用对话框。对话框窗口的内容可以通过像往常一样使用html（）修改对话框div的内容来轻松修改。

您能提供更多关于如何初始化对话框以及有多少对话框的上下文吗？嘿，Taplar，为问题添加了解决方案。你认为初始化可能是问题的原因，这是对的。你能提供更多的上下文来说明你是如何初始化对话框的以及对话框有多少个吗？嘿，Taplar，为问题添加了解决方案。您正确地怀疑初始化是问题的可能原因。