twitter-bootstrap 在选项卡更改时将焦点设置到 Bootstrap TabContent 中的输入
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/24491779/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Set focus to an input within a Bootstrap TabContent on tab change
提问by Rafael A. M. S.
I need to set focus to "inputOne" input when tabOne is selected, and set focus to "inputTwo" when tabTwo is selected.
我需要在选择 tabOne 时将焦点设置为“inputOne”输入,并在选择 tabTwo 时将焦点设置为“inputTwo”。
<ul class="nav nav-tabs">
<li class="active"><a href="#tabOne" data-toggle="tab">Tab One</a></li>
<li class=""><a href="#tabTwo" data-toggle="tab">Tab Two</a></li>
</ul>
<div id="tabContent" class="tab-content">
<div class="tab-pane fade" id="tabOne">
<input type="text" id="inputOne" />
</div>
<div class="tab-pane fade" id="tabTwo">
<input type="text" id="inputTwo" />
</div>
</div>
回答by BENARD Patrick
回答by nthall
You can rely on the bootstrap "shown" event for the tabs to handle this:
您可以依靠选项卡的引导程序“显示”事件来处理此问题:
$(".nav-tabs a").on("shown.bs.tab", function(event) {
$(event.target.href.value + " input").focus();
});
more info on the tab event: http://getbootstrap.com/javascript/#tabs
有关选项卡事件的更多信息:http: //getbootstrap.com/javascript/#tabs
回答by stacky
You can write the following jquery code :
您可以编写以下 jquery 代码:
$( "#tabOne" ).click(function() {
$( "#inputOne" ).focusin()
});
Do the same thing for tabTwoalso.
为tabTwo也做同样的事情。

