Jquery #项目未移动选项卡-引导

我很难弄清楚标签系统在引导中是如何工作的

我有以下代码：

    <div class="tabbable-line">
                <ul class="nav nav-tabs ">
                    <li class="active">
                        <a href="#standings" data-toggle="tab">
                        Standings </a>
                    </li>
                    <li>
                        <a href="#find_match" data-toggle="tab">
                        Find Match </a>
                    </li>
                    <li>
                        <a href="#rules" data-toggle="tab">
                        Rules </a>
                    </li>
                </ul>
                <div class="tab-content">
                    <div class="tab-pane active" id="standings">
                        <p>First Tab</p>
                    </div>
                    <div class="tab-pane" id="find_match">
                        <p>Second Tab</p>
                    </div>
                    <div class="tab-pane active" id="rules">
                        <p>Third Tab</p>
                    </div>
                </div>
     </div>

第一选项卡

第二选项卡

第三选项卡

这将使用定位在选项卡之间导航，对吗？那么，我如何通过输入

http://url.com/#rules

当我尝试这个时，它不起作用

---

任何帮助都将不胜感激

引导不使用href属性来导航选项卡。它只是指当我们单击tab时要显示的div的ID。

---

在bootstrap JS中，只需搜索data toggle=“tab”和tab.prototype.show就可以大致了解tab在bootstrap中的工作原理。

在这种情况下，Twitter bootrap对您没有任何帮助。您可以在页面中插入一些脚本：

$(function() {
  $('.tabbable-line [href="' + location.hash + '"]').tab('show');
});

---

我们可以将此代码用于基于url的导航选项卡，然后单击更新url

$('.nav-tabs li [href="' + location.hash + '"]').tab('show');

$('.nav-tabs li a').click(function(){
    window.location.hash = $(this).attr('href');
});

---

因此，无法从其他页面导航到选项卡？是的，您可以$（document）.ready（函数（）{//触发}的click事件）；它会起作用的