javascript - 关闭对话框时出现确认窗口的问题？

Question

当我将卡片添加到收件箱时。然后可以双击该卡，弹出对话框。在对话框中，我有两个按钮(保存)和(取消)。当我按“取消”按钮时，会弹出确认窗口。

我希望当我按下右上角的关闭按钮时，会弹出确认窗口。我尝试通过这部分代码来修复它，但没有成功:

close: function () {
                $('#dialog-confirm').dialog({
                    resizable: false,
                    height: 300,
                    modal: true,
                    draggable: false,
                    buttons: {
                        YES: function () {
                            $(this).dialog("close");
                            $('#modalDialog').dialog("close");
                        },
                        Cancel: function () {
                            $(this).dialog("close");
                        }
                    }
                });
            } 

问题是当我这样做时，对话框窗口首先关闭，然后弹出确认窗口。我不想要这样，但我想要相反的结果。

JQuery:

$(function () {
    // Click function to add a card
    var $div = $('<div />').addClass('sortable-div'); 
    $('<label>Title</label><br/>').appendTo($div);              
    $('<input/>', { "type": "text","class":"ctb"}).appendTo($div);
    $('<input/>', { "type": "text","class":"date"}).appendTo($div);
    var cnt =0,$currentTarget;
    $('#AddCardBtn').click(function () {
      var $newDiv = $div.clone(true);
      cnt++;  
      $newDiv.prop("id","div"+cnt);  
      $('#userAddedCard').append($newDiv);
//      alert($('#userAddedCard').find("div.sortable-div").length);        
    });

    // Double click to open Modal Dialog Window
    $('#userAddedCard').dblclick(function (e) {
        $currentTarget = $(e.target);

        $('#modalDialog').dialog({
            modal: true,
            height: 600,
            width: 500,
            position: 'center',
            buttons: {
                Save: function () { //submit

                    var val = $("#customTextBox").val();
                    $currentTarget.find(".ctb").val(val);
                    $currentTarget.find(".date").val($("#datepicker").val());
                    $('#modalDialog').dialog("close");

                },
                Cancel: function () { //cancel

                $('#dialog-confirm').dialog({
                resizable: false,
                height: 300,
                modal: true,
                draggable: false,
                buttons: {
                    YES: function () {
                        $(this).dialog("close");
                        $('#modalDialog').dialog("close");
                    },
                    Cancel: function () {
                        $(this).dialog("close");
                    }
                }
            });

                }

            },
            close: function () {
                $('#dialog-confirm').dialog({
                    resizable: false,
                    height: 300,
                    modal: true,
                    draggable: false,
                    buttons: {
                        YES: function () {
                            $(this).dialog("close");
                            $('#modalDialog').dialog("close");
                        },
                        Cancel: function () {
                            $(this).dialog("close");
                        }
                    }
                });
            }
        });

    });

    $("#datepicker").datepicker({showWeek:true, firstDay:1});


});

也许我错了，我就是这么做的。知道如何修复它吗？

Live Demo

Answer 1

您可以尝试使用beforeClose确认窗口，如果确认则关闭对话框。