jQuery UI 对话框按钮焦点 [英] jQuery UI dialog button focus

查看：42 发布时间：2021/12/17 22:12:47 jquery-ui dialog

本文介绍了jQuery UI 对话框按钮焦点的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

当 jQuery UI 对话框打开时，它会选择其中一个按钮并突出显示它或将焦点设置到它等等......我如何停止这种行为，以便在对话框打开时没有突出显示任何按钮?

EDIT:我在对话框选项中尝试了以下操作，但没有从按钮上移除焦点:

<代码>...打开:功能(事件，用户界面){ $(myunimportantdiv").焦点()；},...

注意:作为一种临时解决方法，我修改了 .ui-state-focus 的 CSS，但这并不理想...

解决方案

使用模糊方法.你可以试试这个样本.

<头><title>不关注 jQuery 对话框</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() {//确认或取消对话框//默认关注确认.$('#noFocusDialog').dialog({自动打开:假，纽扣: {确认:函数(){$(this).dialog('close');},取消:函数(){$(this).dialog('close');}}});//触发打开对话框$('#openNoFocusDialog').click(function() {$('#noFocusDialog').dialog('open');//移除焦点中的所有按钮//带有 ui-dialog 类的 div$('.ui-dialog :button').blur();});});<身体><a id="openNoFocusDialog" href="#">打开对话框</a><div id="noFocusDialog"><p>确认没有元素具有焦点</p>

When a jQuery UI dialog opens, it selects 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(); },
...

NOTE: As a temporary workaround I modified the CSS for .ui-state-focus but this isn't ideal...

解决方案

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 对话框按钮焦点的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！

查看全文

jQuery UI 对话框按钮焦点 [英] jQuery UI dialog button focus

问题描述

相关文章

其他开发最新文章

热门教程

热门工具

登录关闭

jQuery UI 对话框按钮焦点 [英] jQuery UI dialog button focus

问题描述

相关文章

其他开发最新文章

热门教程

热门工具

登录 关闭

登录关闭