twitter-bootstrap Twitter Bootstrap Modal w/tabs 默认为第一个选项卡
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/13749883/
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
Twitter Bootstrap Modal w/tabs default to first tab
提问by SuperNinja
Using Bootstrap modal that contains tabs. The modal is called from a php generated table of gallery names.
使用包含选项卡的 Bootstrap 模式。该模式是从 php 生成的画廊名称表中调用的。
Table Data
表格数据
<td>
<a href="#" class="galName" data-target="#myModal" data-toggle="modal" id="update_<?php echo $gal['id']; ?>" >
<?php echo $gal['name']; ?>
</a>
</td>
The modal opens and the first tab is selected on initial fire. If I navigate to another tab close the modal and select a different gallery the modal opens to the last tab that was open.
模态打开并在初始触发时选择第一个选项卡。如果我导航到另一个选项卡关闭模态并选择不同的图库,模态将打开到最后一个打开的选项卡。
How do I make sure that when the modal is opened, it always opens to the first tab?
如何确保打开模态时,它始终打开到第一个选项卡?
Modal Tabs
模态标签
<ul id="myTab" class="nav nav-tabs">
<li class="active">
<a href="#home" data-toggle="tab">Home</a>
</li>
<li class="">
<a id="uploadRevision" href="#upload" data-toggle="tab">Upload Revision</a>
</li>
<li class="">
<a href="#editRev" data-toggle="tab">Edit Revision</a>
</li>
</ul>
.galName fires an initUpdate function in effort to set first tab as default. It sets the tab but tab content is not show.
.galName 触发 initUpdate 函数以将第一个选项卡设置为默认值。它设置选项卡但不显示选项卡内容。
function initUpdate()
{
$('#myModal a:first').tab('show');
}
Thanks for the help.
谢谢您的帮助。
回答by SuperNinja
Found the solution. Must remove the class="active" from both tab and tabContent. Thanks to @merv - https://stackoverflow.com/a/11762931/1214858
找到了解决办法。必须从 tab 和 tabContent 中删除 class="active"。感谢@merv - https://stackoverflow.com/a/11762931/1214858
回答by gratify
Simple; use class "active" to show particular tab on load.
简单的; 使用“active”类在加载时显示特定选项卡。
Like below:
像下面这样:
<!-- Nav tabs -->
<!-- content tabs -->
Remove class="tab-pane active" in li of above on nav of tab and content which you want to make it in active.
删除上面的 li 中的 class="tab-pane active" 在要使其处于活动状态的选项卡和内容的导航中。

