bootstrap 2.1 模态自动对焦不起作用答案

【问题标题】：bootsprap 2.1 modal autofocus not workingbootstrap 2.1 模态自动对焦不起作用
【发布时间】：2015-07-11 04:18:31
【问题描述】：

问题：自动对焦不适用于我的 bootstrap 2.1 弹出形式

我正在使用 twitter bootstrap 2.1 尝试在单击并显示弹出窗口时自动聚焦在第一个输入元素上。

我需要指导来解决此问题。我尝试使用 JavaScript focus 功能，也尝试使用 html autofocus 属性，但它不适用。

Bootstrap modal show event

我尝试了这个堆栈溢出问题，但它需要将我的引导程序更新到 3.0，但我无法更新，因为它需要大量时间。

我想要与 bootstrap 2.1 类似的自动对焦，请指导我实现这一目标。

提前致谢

【问题讨论】：

你能分享一些代码来展示你到目前为止所做的尝试吗？

标签： javascript jquery html twitter-bootstrap twitter-bootstrap-2

【解决方案1】：

所有使用模态的通用解决方案无需为单个模态编写方法你可以试试这个

$('.modal').on('shown', function () {
        var first_elemt = $('.modal').filter(':visible:first').find('input[type=text]').attr('id');
       $('#'+first_elemt).focus();
     });

【讨论】：

【解决方案2】：

我解决了这个...

Bootstarp 模型有“显示”事件。它在模型打开后触发。只需将您的代码作为焦点第一个元素的表单元素放在事件函数上。如下所示

$('your-model-id').on('shown', function () {
  $('#your-text-box-id').focus();
});

【讨论】：