jQuery 模态对话框打开并选择按钮

Question

我有一个这样设计的对话框:

<div id="choose_product" title="Choose a Product" style="display:none;">
    <button id="sel_1">Prod. 1</button>
    <button id="sel_2">Prod. 2</button>
</div>

使用 JS:

    $('#choose_product').dialog({
            autoOpen: true,
            show: "blind",
            hide: "explode",
            modal: true,
            buttons: {
                Cancel: function(){
                    $(this).dialog("close");
                }
            }
        });

当对话框打开时，默认选择(突出显示)Prod 1 按钮，我不知道为什么。你可以在这个JSFiddle上看到它。当您单击 RUN 时，您可以看到 Prod. 1 按钮默认处于选中状态。有谁知道为什么会发生这种情况？我是不是做错了什么？

谢谢!

** 编辑 **

在我的应用程序中，我实际上使用 $('#choose_product').dialog("open"); 打开对话框。如果您随后使用 $('#choose_product :button').blur(); ，则默认情况下不会选择任何按钮。一个轻微的解决方法，但似乎有效。

查看更新的fiddle .

Answer 1

我的假设是，当您为 jQuery UI 对话框指定“模态”类型时，它会自动聚焦第一个按钮。另外，它的样式不正确的原因是您没有在 fiddle 中添加 css。

编辑:经过更多研究，我发现 this question这证实了我上面所说的。