具有选项卡的bootstrap div在页面加载时自动显示第二个选项卡

Question

我有一个带有多个选项卡的div，当您单击每个选项卡时，它们会显示嵌套的div。我需要知道如何在页面加载时自动显示第二个选项卡：

  <div style="border: solid 1px #ddd; padding: 6px 6px; min-height: 300px;">
                <ul id="tabs" class="nav nav-tabs">
                    <li><a href="#general" data-toggle="tab">General Info</a></li>
                    <li><a href="#narrative" data-toggle="tab">Narrative</a></li>
                     <li><a href="#audit" data-toggle="tab">Audit</a></li>
               </ul>
                <div id="my-tab-content" class="tab-content paddingbottom20">
                    <div id="general" class="tab-pane">

                  </div>
                     <div id="narrative" class="tab-pane">

                    </div>
                    <div id="audit" class="tab-pane">

                    </div>
               </div>
            </div>

Answer 1

使用“活动”类。

 <li class="active"><a href="#narrative" data-toggle="tab">Narrative</a></li>

 <div id="narrative" class="tab-pane active"></div>