Question

我正面对这个问题，我不知道如何解决它。我在这里找到了一些类似的解决方案，但它们都不是我需要的。让我们说，我有一些代码可以围绕一键式jQuery UI对话框进行简单的包装。在这种情况下，一切都很简单：

$parent.keypress(function(e) {
    switch ( e.keyCode ) {
    case 13:
    case 27:
        $parent.unbind("keypress");
        $plugin.dialog("destroy");
        break;
    }
});

因为我这里有唯一的按钮。但是，如果我有两个甚至更多按钮怎么办？我认为有类似$parent.dialog(...)或类似$parent.trigger("__keypress__", "__button__name__")的东西 - 我在jQuery UI Dialog API中找不到任何类似的东西。有没有解决方法？

感谢大家的建议。

更新：
附：我找到了一个粗略的解决方案：

    var $parent = $dialog.parent();
    $parent.keypress(function(e) {
        switch ( e.keyCode ) {
        case 13:
            $parent.find(".ui-dialog-buttonpane button:contains('OK')").click();
                break;
        case 27:
            $parent.find(".ui-dialog-buttonpane button:contains('Cancel')").click();
            break;
        default:
            return;
        }
        $parent.unbind("keypress");
        $plugin.dialog("destroy");
    });

但它可以更简单吗？我目前的解决方案需要进行大量的代码更改。

Answer 1

$（function（）{ $（ “＃对话”）对话框（ “破坏”）;

    $("#dialog-confirm").dialog({
        resizable: false,
        height:140,
        modal: true,
        buttons: {
            'Delete all items': function() {
                //Delete some stuff
                $(this).dialog('close');
            },
            Cancel: function() {
                $(this).dialog('close');
            }
        }
    });
});

Answer 2

我没有太多时间，而且我已经实施了一些工作。不知道它是否好，但似乎有用但粗糙。

$.fn.bindShortcuts = function(shortcuts) {
    var $this = $(this);
    var $parent = $this.parent();
    var isByMouse = false;
    $parent.bind("keypress.shortcuts", function(e) {
        var caption = shortcuts[e.keyCode];
        if ( caption ) {
            var button = $parent.find(".ui-dialog-buttonpane button:contains('" + caption + "')");
            if ( button.length && !isByMouse ) {
                button.click();
                $parent.unbind("keypress.shortcuts");
            }
        }
    });
    $parent.find(".ui-dialog-buttonpane button").click(function() {
        isByMouse = true;
        $parent.unbind("keypress.shortcuts");
    });
    return $this;
};

$.fn.bindOkCancel = function(ok, cancel) {
    return $(this).bindShortcuts({
        13: ok,
        27: cancel
    });
}

以及如何使用它：

dialog = $dialog.dialog({
    buttons: {
        "Cancel": $.noop,
        "Export": $.noop
    }
}).bindOkCancel("Export", "Cancel");

：）

是否可以模拟按钮点击或指定默认的OK＆amp;在jQuery UI Dialog中取消动作处理程序？

2 个答案: