Question

所以我有一个jQuery UI对话框，里面有一些按钮（完整示例在这里=＆gt; http://jsfiddle.net/VLr5G/3/）：

<div id="test">
    <button>Btn 1</button>
    <button>Btn 2</button>
    <button>Btn 3</button>
</div>

我想要做的是强调“关闭”按钮 - 我在对话框打开时尝试应用以下代码：

open: function() {
    $(this).parents('.ui-dialog-buttonpane button:eq(0)').focus();
}

不幸的是，焦点始终保持在对话框内的第一个按钮上。这是一个错误，还是我错过了什么？

非常感谢您的帮助！

更新

好的，所以斯坦利的答案在我的第一个例子中运行良好......但是尝试更改jQuery UI的版本=＆gt; http://jsfiddle.net/VLr5G/10/

到目前为止，我发现它直到jQuery UI 1.10.0。

Answer 1

您没有正确关闭关闭按钮。你应该这样做：

$(document).ready(function() {
    $('#test').dialog({
        buttons: {
            'Close': function() {$(this).dialog('close');}
        },
        open: function() {
            $(this).parent().find('.ui-dialog-buttonpane button:eq(0)').focus();
        }
    });
});

工作jsfiddle：http://jsfiddle.net/GG7EP/2/

<强>更新要使它适用于jQuery 1.10.0或更高版本，请在focus事件中调用按钮的焦点功能

$(document).ready(function() {
    $('#test').dialog({
        buttons: {
            'Close': function() {$(this).dialog('close');}
        },
        focus: function() {
            $(this).parent().find('.ui-dialog-buttonpane button:eq(0)').focus();
        }
    });
});

JsFiddle：http://jsfiddle.net/V3P4t/

jQuery UI - 对话框内的按钮不断获得焦点

1 个答案: