无法在 ui-dialog 中删除自动对焦 [重复]

Posted

技术标签:

【中文标题】无法在 ui-dialog 中删除自动对焦 [重复]【英文标题】:Unable to remove Autofocus in ui-dialog [duplicate] 【发布时间】:2012-04-06 15:52:13 【问题描述】:

我的jQuery UI对话框中的第一个元素是一个输入,选择时,选择打开datepicker ...

我怎样才能禁止这个输入被首先选中?

【问题讨论】:

你有测试页吗?或创建fiddle 展示您的案例 这是一个带有 ui-dialog 的通用问题。 【参考方案1】:

在调用对话框之前添加以下代码。这将清除自动对焦代码。它在 jquery 2.0.3 中对我有用。

$.ui.dialog.prototype._focusTabbable = function();

【讨论】:

谢谢 - 这帮助我解决了对话框总是回到第一个元素的问题,而不仅仅是打开 正是我想要的! 太棒了。我目前需要混合使用 jqueryUI 和 bootstrap,并且使用了很多没有输入的对话框,这导致我所有的第一个对话框按钮都处于悬停状态,因此看起来很糟糕。这解决了这个问题 它需要 jQuery UI 1.10 或更高版本 这很笨拙,但效果很好。感谢您为我节省了大量时间。【参考方案2】:

很简单,只要在对话框打开时触发输入元素上的blur事件即可。

$("#dialog").dialog(
    open: function(event, ui) 
        $("input").blur();
    
);

看看 here

Solution 使用日期选择器

注意:要更深入地解决这个问题,也请阅读this 答案。

【讨论】:

不幸的是,这在处理具有 autoOpen: false 的对话框时不起作用。 jsfiddle.net/8VbEU/134【参考方案3】:

JQuery 将自动对焦设置在找到的第一个输入上。 因此,通过在对话框的第一行创建一个“假”输入来偷偷摸摸地玩它:

<input type='text' size='1' style='position:relative;top:-500px;' />

因此您的输入将在窗口之外并具有焦点。为我解决了问题;p

【讨论】:

以上是关于无法在 ui-dialog 中删除自动对焦 [重复]的主要内容,如果未能解决你的问题,请参考以下文章

如何在 Svelte 3 中进行条件自动对焦

移动 Safari 自动对焦文本字段

如何在 mat-select 中设置自动对焦?

海康威视摄像头自动对焦

阻止自动对焦跨域子帧中的表单控件

尼康D7200手动挡无法对焦,怎么解决?