引导模式自动切换中的选项卡答案

【问题标题】：tabs in bootstrap modal autoswitches引导模式自动切换中的选项卡
【发布时间】：2013-05-02 08:25:13
【问题描述】：

我在引导模式中使用选项卡，选项卡显示良好，但问题是，当我单击“第 2 节”选项卡时，它会立即切换回“第 1 节”选项卡。下面是代码。任何可以帮助我使用 JavaScript 执行此操作的人，或者可能是什么问题？我已经搜索没有成功！

<div class="tabbable"> 
    <ul class="nav nav-tabs">
        <li class="active"><a href="#tab1" data-toggle="tab">Section 1</a></li>
        <li><a href="#tab2" data-toggle="tab">Section 2</a></li>
    </ul>

    <div class="tab-content">
        <div class="tab-pane active" id="tab1">
            <p>I'm in Section 1.</p>
        </div>

        <div class="tab-pane" id="tab2">
            <p>Howdy, I'm in Section 2.</p>
        </div>
    </div>
</div>

【问题讨论】：

可能是因为active这个词
PawCabelin，我如何使用 jquery 以编程方式解决这个问题。我不是这方面的专家。非常感谢您的帮助。
我创建了一个小提琴，它似乎工作正常jsfiddle.net/chrismoutray/KBRJy
那么当一个标签被点击时，会发生回发吗？如果是这样，则所选选项卡将刷新回 Section 1，因为这是基于您的标记的默认设置
试试@ChrisMoutray 制作的小提琴，效果很好。

标签： javascript twitter-bootstrap bootstrap-modal

【解决方案1】：

阅读Bootstrap help documentation on tabs 需要包含bootstrap-tab.js，否则页面将回发/无法正常工作。

需要 jQuery 插件

所有可选项卡都由我们的轻量级 jQuery 插件提供支持。在 JavaScript 文档页面上阅读有关如何使可选项卡栩栩如生的更多信息。

另见此处>http://twitter.github.io/bootstrap/javascript.html#tabs

所以有几种方法可以得到这个

在自定义下载时包含 Togglable tabs 插件http://twitter.github.io/bootstrap/customize.html（请参阅第 2 节 - 选择 jQuery 插件）
下载完整包或链接到 CDN，例如 http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.1.0/bootstrap.min.js

我认为您也可以在这里链接进行测试

`http://twitter.github.io/bootstrap/assets/js/bootstrap.js`

【讨论】：