通过一个导航选项卡控制多个选项卡内容

  • Z时代
  • 2024-01-10
  • 分类：问答

我有一个常规的Twitter Bootstrap 3标签。我要做的就是控制

tab-content一个nav-tabs元素来控制多个容器。

在此示例中，当我更改标签时，仅第一个被更改。我要两个容器都改变，而不仅仅是第一个。

谢谢！

回答：

我将 属性添加到a元素并更改第二个tab内容中的id

我修改了这行

您的：

<li class="active"><a href="#home" data-toggle="tab">C1</a></li>
<li><a href="#profile" data-toggle="tab">C2</a>  </li>

我的更新：

<li class="active"><a href="#home" data-target="#home, #home_else" data-toggle="tab">C1</a></li>
<li><a href="#profile" data-target="#profile, #profile_else" data-toggle="tab">C2</a>  </li>

第二个选项卡内容，您的：

<div id="myTabContent" class="tab-content">
    <div class="tab-pane fade in active" id="home">
        <p>Content 1.</p>
    </div>
    <div class="tab-pane fade" id="profile">
        <p>Content 2.</p>
    </div>
</div>

我的更新：

<div id="myTabContent2" class="tab-content">
    <div class="tab-pane fade in active" id="home_else">
        <p>Content 1.</p>
    </div>
    <div class="tab-pane fade" id="profile_else">
        <p>Content 2.</p>
    </div>
</div>

以上是 通过一个导航选项卡控制多个选项卡内容 的全部内容， 来源链接： utcz.com/qa/401580.html

回到顶部