如何使当前选项卡显示为活动状态？答案

【问题标题】：How do I make the current tab appear active?如何使当前选项卡显示为活动状态？
【发布时间】：2014-05-23 07:53:09
【问题描述】：

当我在特定链接页面时，我正在尝试将引导程序中的这些选项卡设置为活动状态。我是网页设计的新手。任何人都知道如何做到这一点？这是我的html代码。

  <div id="top">
       <ul class="nav nav-tabs">
           <li class="active"><a href="index.php">Home</a></li>
           <li><a href="history.php">History</a></li>
           <li><a href="leader.php">Leaderboard</a></li>
           <li><a href="talk.php">Comments</a></li>
       </ul>
  </div>

【问题讨论】：

标签： html twitter-bootstrap tabs

【解决方案1】：

如果 href 与当前页面的 URL 匹配，则使用此 javascript 将 active 类添加到父 li：

<script type="text/javascript">
    jQuery(document).ready(function($){
        var url = window.location.href;
        $('.nav a[href="'+url+'"]').parent().addClass('active');
    });
</script>

【讨论】：

【解决方案2】：

如果您使用的是 php，最好在服务器端使用 PHP 而不是使用 Javascript...

See this question for one solution

【讨论】：