Question

我有一个使用jQuery的Dialog UI插件的对话模式框。我试图检测用户是否使用标题栏右上角的“X”按钮关闭了该框，但没有运气。我试过了：

$('.myModal').dialog({
    title: 'dialog 1',
    beforeClose: function(){
        //do something
    }
}).dialog("open");

无论用户操作如何，都将执行该功能。即如果用户点击“确定”而不是“X”按钮。

我查看了对话框文档，找不到能够提供我正在寻找的结果的事件，方法或选项。任何想法都会非常感激。

Answer 1

查看此链接...

http://forum.jquery.com/topic/jquery-dialog-close

第四个回复是您正在寻找的回复，更少参考此链接。

http://jsbin.com/obafo

...他已经设置了一个要查看的示例，其中包含此代码......

$("#dialog").dialog({

close: function(event, ui) {

    if ( event.originalEvent && 
                $(event.originalEvent.target).closest(".ui-dialog-titlebar-close").length ) {

        $("body").append("do some  stuff<br>");

    }

}

})
.find("button")
.click(function() {

    $("body").append("just close  dialog<br>");

    $(this).closest(".ui-dialog-content").dialog("close");

});

Answer 2

您需要为beforeClose回调函数包含两个可选参数。

$('.myModal').dialog({title: 'dialog 1'
                  beforeClose: function(event,ui){ //do something }}).dialog("open");

您需要检查事件和/或ui变量，并确定是否按下“X”。

Answer 3

您可以将处理程序附加到关闭按钮的click事件：

$('.myModal')
    .dialog("widget")
    .find(".ui-dialog-titlebar-close").click(function() {

        // do whatever you want here

    });

Answer 4

这假设您没有更改默认关闭文本，该文本显示为X但是innertext是“关闭”。

$('#acceptsignaturediv').dialog({
             title: 'my Title',
             height: 400,
             width: 400,
             buttons: { "Accept": function () { alert('Accept'); },
                 "Decline": function () { alert('Decline'); }
             },
             beforeClose: function (event, ui) { if (event.originalEvent != undefined && event.originalEvent.srcElement.innerText == "close") { alert('You must accept or decline'); return false; } }
         });

Answer 5

我通过检查originalevent是否有类型点击的原始事件来解决它。条件很长，但它确实有效。

$('.myModal').dialog({
    title: 'dialog 1',
    beforeClose: function(){
        if (e.originalEvent && e.originalEvent.originalEvent && e.originalEvent.originalEvent.type == "click") {
            // do something
        }
    }
}).dialog("open");

jQuery Dialog UI无法检测是否单击了关闭图标

5 个答案: