小编xop*_*p32的帖子

转到不同页面链接上的特定选项卡单击并切换活动类

我正在开发一个网页,其中我正在使用Twitter的Bootstrap Framework和他们的Bootstrap Tabs JS.它工作得很好,但我想在选项卡面板外添加额外的链接来打开选项卡,它可以正常点击链接下的标签链接.ul --> li

但是,当我单击外部链接时,nav panel-tabs如何在单击自身外部的链接时将选项卡面板切换和active类添加到CSS类元素(因为类在我的情况下显示不同的背景颜色).nav panel-tabs linav panelactive

例如:

这些链接位于页面面板代码之外:

<a href="page.php#gallery">Gallery</a>
<a href="page.php#movies">Movies</a>
Run Code Online (Sandbox Code Playgroud)

我需要将选项卡类的状态切换为活动状态,并在单击其他链接时将其删除.<ul class="nav panel-tabs"> --> <li>

这是带有导航标签的面板:

<div class="panel-heading">
    <div class="padpanel">Panel Heading</div>
    <div class="pull-left">
        <ul class="nav panel-tabs">
            <li class="active"><a href="#profile" data-toggle="tab">Profile</a></li>
            <li><a href="#gallery" data-toggle="tab">Gallery</a></li>
            <li><a href="#movies" data-toggle="tab">Movies</a></li>
        </ul>
    </div>
</div>

<div class="panel-body">
    <div class="tab-content">
        <div class="tab-pane active" id="profile">Profile tab </div>
    </div>
</div>
<div class="panel-body">
    <div class="tab-content">
        <div class="tab-pane" id="gallery">Gallery tab </div>
    </div>
</div>
<div class="panel-body"> …
Run Code Online (Sandbox Code Playgroud)

html javascript tabs twitter-bootstrap-3

4
推荐指数
1
解决办法
2万
查看次数

标签 统计

html ×1

javascript ×1

tabs ×1

twitter-bootstrap-3 ×1