javascript - 带有 bool 值返回的 jQuery UI 对话框 - true 或 false

Question

我正在尝试替换 javascript confirm()。我找到了可以完全自定义的 jquery dialog() 函数。问题是我无法让它返回 true 或 false。

这是我的代码:

$('#delBox').dialog(
        { autoOpen: false, resizable: false, modal: true, closeOnEscape: true, width: 300, height: 'auto', title: 'Deletar registro',
            buttons: {
                "Ok": function () {
                    return true;
                }, "Cancelar": function () {
                    $(this).dialog("close");
                    return false;
                }
            },
            open: function () {
                var buttonsSet = $('.ui-dialog-buttonset').find("button:contains('Ok')");
                buttonsSet.attr("class", "ui-button ui-state-default");
                $('.ui-dialog-titlebar-close span').empty();
                $('.ui-dialog-buttonset').find("button:contains('Ok')").button({
                    text: false,
                    icons: {
                        primary: 'ui-icon-ok'
                    }
                });

                $('.ui-dialog-buttonset').find("button:contains('Cancelar')").button({
                    text: false, 
                    icons: {
                        primary: 'ui-icon-cancel'
                    }
                });
            }
        });

这只会在选择任何选项之前返回一个对象:

function deletar() {
     alert($('#delBox').dialog('open'));
}

Answer 1

jQueryUI 对话框不能返回 true 或 false，因为它们显示在其他内容之上但没有阻止执行。

你能做的最好的事情是:

1. 将框设置为模态，以便它隐藏其他内容

2. 根据选择的选项提供要使用的回调。

对于额外的奖励积分，您可以创建一个 $.Deferred() promise 对象并在显示对话框时返回它。然后，您可以在按钮事件处理程序中resolve 或reject 该 promise 。

这将使您清楚地区分显示对话框和执行随后由它触发的操作:

function showDialog() {
   var def = $.Deferred();

   // create and/or show the dialog box here
   // but in "OK" do 'def.resolve()'
   // and in "cancel" do 'def.reject()'

   return def.promise();
}

showDialog().done(function() {
    // they pressed OK
}).fail(function() {
    // the pressed Cancel
});

// NB: execution will continue here immediately - you shouldn't do
//     anything else now - any subsequent operations need to be
//     started in the above callbacks.