3 
    var error = 1;
    $(document).on('click', '.ui-icon-closethick', function(event){
        if(error == 1){
           alert('error');
           event.preventDefault();
           event.stopPropagation();
           return false;
        } 
    })

如何不关闭 jQuery UI 的对话框？现在，如果我单击关闭按钮 (x)，则会出现警报错误，但对话框正在关闭。

现场演示

4

7 回答 7

13

您可以将beforeClose选项添加到对话框并在其上返回 false：

$("#dialog").dialog({
   beforeClose: function(){
     return false;
   }
});

演示：http: //jsfiddle.net/UfpHz/9/

于 2013-07-10T09:27:33.110 回答
5

那么你可以通过删除关闭按钮来做到这一点。

$("#YOUR_DIALOG_DOM_ID").dialog({
   closeOnEscape: false,
   open: function(event, ui)
   {
      $(".ui-dialog-titlebar-close", ui.dialog || ui).hide();
   }
});
于 2013-07-10T09:25:21.210 回答
4

您可以使用该beforeClose事件来防止对话框关闭。

像这样：

$( "#dialog" ).dialog({
    beforeClose: function(){
        if(error == 1){
            alert('error');
            return false;
        } 
    }
});
于 2013-07-10T09:28:10.453 回答
2

您需要在beforeClose事件和返回true或false那里查找错误。

var error = 1;

$(function () {
    $("#dialog").dialog({
        beforeClose: function (event, ui) {
            if (error === 1) { // in javascript you compare with ===, not ==
                alert('error');
                return false; // error, dialog will not close
            }
            return true; // no error, dialog will close
        }
    });
});

http://jsfiddle.net/RHhwV/

于 2013-07-10T09:27:50.223 回答
1

您也可以处理关闭事件

$(function() {
      $( "#dialog" ).dialog({
          close: function(event,ui){
              $(this).dialog('open');
          }
      });
  });

可以在此链接中找到更多文档

演示

于 2013-07-10T09:27:34.950 回答
0

利用

beforeClose: function( event, ui ) {return false;}

来自网址：http ://api.jqueryui.com/dialog/#event-beforeClose

于 2013-07-10T09:28:46.377 回答
0

如果我理解正确，您希望允许用户单击右上角对话框上的“X”按钮，但您不想让他们关闭窗口。您可能想要触发不同的事件。

使用您自己的 dialogClass 在您自己的代码中尝试此示例：

$("#dialogId").dialog({
        dialogClass: "dialogId",
        title:     "someTitle",
        //modal:     true,
        //autoOpen:  false, 
        //resizable: false,
        //closeOnEscape: false,
        height:    500,
        width:     1000,
        open : function(event, ui){       
        },
        beforeClose: function (event, ui) {
            if ($(".dialogId .ui-dialog-titlebar-close").is(":focus")) { 
                alert('X clicked but do not close!');
                return false; // do not close dialog
            }
            return true; // close dialog
        }, 
        buttons: [
          { }
        ]
});

本质上，这里发生的是询问对话框的 X 按钮是否被聚焦（也称为单击），然后我们返回 false。如果您愿意，您可以在此处触发不同的事件，例如创建您自己的自定义“您确定要取消吗？” 顶部弹出对话框。

干杯! 祝你好运。

杰弗里

于 2017-04-11T20:32:05.790 回答