1

我正在尝试将链接添加到页面顶部以访问数据选项卡,除了它们在 Twitter Bootstrap 示例的正常选项卡部分中工作。

我通过 Bootstrap 有以下基本选项卡:

<ul class="nav nav-tabs">
    <li><a href="#news" data-toggle="tab" class=""><span class="glyphicon glyphicon-comment"></span> Latest News</a>
    </li>
    <li><a href="#people" data-toggle="tab" class=""><span class="glyphicon glyphicon-user"></span> The People</a>
    </li>
    <li><a href="#agenda" data-toggle="tab" class=""><span class="glyphicon glyphicon-calendar"></span> Agenda</a>
    </li>
    <li><a href="#messages" data-toggle="tab" class=""><span class="glyphicon glyphicon-plane"></span> Accommodations</a>
    </li>
    <li><a href="#faq" data-toggle="tab" class=""><span class="glyphicon glyphicon-comment"></span> FAQ</a>
    </li>
</ul>
<!-- End tabs -->

此处的内容示例:

<div class="tab-content">
    <div class="tab-pane active" id="news">
        <div class="span5">
            <ul class="green-checks">
                <li>
                    <div class="panel panel-info">Information coming soon!</div>
                </li>
                <!--<li><cite>May 24, 2013 &mdash; </cite>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</li>-->
            </ul>
        </div>

我想要做的是通过标题导航以及从选项卡部分本身调用选项卡。像这样复制代码不起作用:

<li class="menu-item"><a href="#people" data-toggle="tab" class="">The People</a></li>
4

1 回答 1

0

编辑- 更新为包括点击后滚动到选项卡。


模拟一个 tab-switchclick()代替:

function tabClick(tab) {
    $('a[href='+tab+']').click();
    $(tab).animate({scrollTop:0}, 'fast');
}

...

<li class="menu-item">
   <a href="#" onclick="tabClick('#people');return false;" data-toggle="tab" class="">The people</a>
</li>
于 2013-10-04T14:26:12.277 回答