twitter引导选项卡在单击选项卡时设置输入焦点

twitter bootstrap tab set input focus when tab click

本文关键字：选项 设置 输入 焦点 twitter 单击      更新时间：2023-09-26

我正在使用http://getbootstrap.com/javascript/#tabs在我的表单中创建选项卡
我需要的是将焦点设置在显示的第一个input="text"上

我在文件或其他地方找不到它。

<div class="tabs">
<ul class="nav nav-tabs">
   <li class="active"><a data-toggle="tab" href="#login1">
      <span class="icon-key"></span>Login</a>
   </li>
   <li class="">
      <a data-toggle="tab" href="#register1"><span class="icon-user"></span>Register
      </a>   
   </li>
</ul>
<div class="tab-content">
   <div id="login1" class="tab-pane active">
      <input type="text"> <!-- focus when tab clicked -->
   </div>
   <div id="register1" class="tab-pane">
      <input type="text"> <!-- focus when tab clicked -->
   </div>
</div>

如果需要，请手动执行。。

$(document).ready(function(){
    $(".tab-pane").on('click', function(){
        $(this).find("input[type=text]").filter(':visible:first').focus();
    });
});

有帮助的锄头。。

第一个输入字段不会自动聚焦，您可以执行以下操作：

$('input').first().focus();

这将聚焦输入字段。你甚至可能想在文档上做这件事，作为一个初始脚本，比如：

$(function() {
    $('input').first().focus();
});
相关文章：