0

我有下面的代码来显示一个只有“确定”按钮的警报对话框和一个带有“取消”和“确定(提交)”按钮的确认对话框。

正如您所看到的,有很多重复的代码,我想知道是否有办法编写这样的代码,以便尽可能少地重复代码(多次编写)?

我正在快速学习 jQuery,但不知道如何更好地编写它?任何帮助或示例将不胜感激?非常感谢

外部 JS:

function alert() {
    var id = $('#dialog-alert');
    id.dialog({
        autoOpen: false,
        dialogClass: 'ui-alert',
        resizable: false,
        modal: true,
        width: 450,
        buttons: [{
            'text': 'OK',
            'class': 'btn btn-green',
            'click': function () { $(this).dialog('close'); }
        }]
    }).dialog('open');
    $('.ui-dialog :button').blur();
};

function confirm() {
    var id = $('#dialog-confirm');
    id.dialog({
        autoOpen: false,
        dialogClass: 'ui-alert',
        resizable: false,
        modal: true,
        width: 450,
        buttons: [{
            'text': 'Cancel',
            'class': 'btn btn-red',
            'click': function () { $(this).dialog('close'); }
        },
        {
            'text': 'OK',
            'class': 'btn btn-green',
            'click': function () { $('#completeform').submit(); }
        }]
    }).dialog('open');
    $('.ui-dialog :button').blur();
};
4

1 回答 1

0

感谢@Alnitak 的帮助,我得到了我想要的东西。我想要一个可以调用对话框的功能,无论是警报还是确认,都显示一两个按钮。对于正在寻找类似东西的人,我的解决方案如下。参数和条件语句的组合。

function dialog(id, btns) {
    var buttons = [{
        'text': 'OK',
        'class': 'btn btn-green',
        'click': function () { $(this).dialog('close'); }
    }]

    if (btns === confirm) {
        buttons = [{
            'text': 'Cancel',
            'class': 'btn btn-red',
            'click': function () { $(this).dialog('close'); }
        }, {
            'text': 'OK',
            'class': 'btn btn-green',
            'click': function () { $('#completeform').submit(); }
        }]
    };
    $('#dialog-' + id).dialog({
        autoOpen: false,
        dialogClass: 'ui-alert',
        resizable: false,
        modal: true,
        width: 450,
        buttons: buttons
    }).dialog('open');
    $('.ui-dialog :button').blur();
};

在 HTML 页面中:

$(function() { dialog('alert', alert); }); 
// or
$(function() { dialog('confirm', confirm); });
于 2013-03-14T10:52:52.730 回答