javascript - 使用 jquery 选择选项卡

Question

我在我的 UI 中使用了 jquery 选项卡。我需要做的是，我需要在页面加载时选择第二个选项卡。默认情况下，它打开带有 class="Active"的标签。但是我不想打开 Active 标签的内容，而是想打开另一个标签的内容。我该怎么做呢。这是我的 html 标签代码:

<div class="typo">
    <div class="container-fluid">

        <div class="Buttons">
            <!--  <h3 class="ghj"><p align="center">Modules</p></h3>-->
             <h1>
                <ul class="nav nav-tabs">
                  <li class="active"><a data-toggle="tab" href="#Basic" class="btn btn-info" role="button">Data Preprocessing</a></li>
                  &nbsp; &nbsp; &nbsp;
                  <li><a data-toggle="tab" href="#WGCNA" class="btn btn-info" role="button">WGCNA</a></li>
                  &nbsp; &nbsp; &nbsp;
                  <li><a data-toggle="tab" href="#Custom" class="btn btn-info" role="button">Genome Mapping</a></li>
                  &nbsp; &nbsp; &nbsp;
                  <li><a data-toggle="tab" href="#RNA" class="btn btn-info" role="button">RNA Seq</a></li>
                  &nbsp; &nbsp; &nbsp;
                </ul>
             </h1>
           </div>
        </div>
    </div>

这里我需要做的是，我需要在页面加载时显示“WGCNA”选项卡的内容。我如何实现这一目标？

Answer 1

您可以使用 tabs api 以编程方式打开选项卡.

有两种方法可以实现这一点。

您可以在启动时通过 active 选项进行初始化，如下所示:

$( ".nav-tabs" ).tabs({
 active: 1
});

记住它是从零开始的。

或者初始化后设置active选项:

$( ".nav-tabs" ).tabs( "option", "active", 1 );