Bootstrap启动模式和显示特定选项卡式内容窗格

时间:2015-01-21 11:37:04

标签: twitter-bootstrap

我正在使用Bootstrap 3来构建一个网站。我正在推出一个包含一些标签的模态。无论如何我可以调用启动模态并指定哪个选项卡应该在模态启动时打开?

我正在使用标准的模态启动代码,例如

data-toggle="modal" data-target="#modal2launch"

然后标签的标准Boostrap代码,例如

 <div role="tabpanel" class="tab-pane fade in active" id="tab1">

所以,我想能够说,启动模式名为“modal2launch”并打开“tab2”......

可能的?

1 个答案:

答案 0 :(得分:0)

如果选项卡窗格位于模态体内,则只需在tab2上设置active类,然后从其他选项卡中删除active类。

如果您需要将其设置为tab2,则可以使用javascript激活模态shown.bs.modal

中的选项卡
$('#myModal').on('shown.bs.modal', function (e) {
    $('#myTab a[href="#profile"]').tab('show') // Select tab by name
    $('#myTab a:first').tab('show') // Select first tab
    $('#myTab a:last').tab('show') // Select last tab
    $('#myTab li:eq(2) a').tab('show') // Select third tab (0-indexed)
})

由于您没有提供太多代码,我使用http://getbootstrap.com/javascript/#tabshttp://getbootstrap.com/javascript/#modals上的示例为您提供了一个想法