jQuery UI对话框按钮的焦点

问题描述：

当jQuery UI对话框打开时，它似乎选择其中一个按钮并将其突出显示或设置焦点等...如何停止此行为，以便在对话框打开时不突出显示任何按钮？

when a jQuery UI dialog opens it seems to select one of the buttons and highlights it or sets focus to it etc... How can I stop this behaviour so that none of the buttons are highlighted when the dialog opens?

编辑

我在对话框选项中尝试过以下操作，没有从按钮中删除焦点

EDIT
I tried the following in the dialog options which didn't remove focus from the buttons

...
open:function(event, ui) { $("myunimportantdiv").focus(); },
...

注意

作为临时解决方法我修改了用于ui-state-focus的css，但这不是理想的...

NOTE
as a temporary workaround I modified the css for ui-state-focus but this isn't ideal...

答

使用blur方法。你可以试试这个例子。

Use the blur method. You can try this sample.

<html>
    <head>
        <title>No Focus on jQuery Dialog</title>
        <link type="text/css" rel="stylesheet" href="ui.all.css" />
        <script type="text/javascript" src="jquery-1.3.2.min.js"></script>
        <script type="text/javascript" src="ui.core.js"></script>
        <script type="text/javascript" src="ui.dialog.js"></script>
        <script type="text/javascript">
            $(document).ready(function() {
                // Dialog to confirm or cancel
                // Focuses on confirm by default.
                $('#noFocusDialog').dialog({
                    autoOpen: false,
                    buttons: {
                        Confirm: function() {
                            $(this).dialog('close');
                        },
                        Cancel: function() {
                            $(this).dialog('close');
                        }
                    }
                });

                // Trigger to open the dialog
                $('#openNoFocusDialog').click(function() {
                    $('#noFocusDialog').dialog('open');

                    // Remove focus on all buttons within the
                    // div with class ui-dialog
                    $('.ui-dialog :button').blur();
                });
            });
        </script>
    </head>
    <body>
        <a id="openNoFocusDialog" href="#">Open Dialog</a>
        <div id="noFocusDialog">
            <p>Confirm that no elements have focus</p>
        </div>
    </body>
</html>

jQuery UI对话框按钮的焦点

相关推荐