使sidebar-nav選項卡處於活動狀態？

我有一個sidebar-nav有幾個選項卡。我怎樣才能讓用戶看到的當前標籤處於活動狀態？我試過活動課，但它似乎讓一個標籤活躍不斷！任何幫助，將不勝感激使sidebar-nav選項卡處於活動狀態？

這是我的觀點：

<div id="wrapper"> 
    <div id="sidebar-wrapper"> 
     <ul class="sidebar-nav"> 
      <li class="sidebar-brand"> 
       <a href="/ci/index.php/adel_ctl/member"> KU Faculty</a> 
      </li> 
      <li> 
       <hr style='margin-top:2px; color:#000;margin-right:30px;'> 
      </li> 
      <li> 
       <a href="/ci/index.php/adel_ctl/profile/<?=$id?>">My Profile</a> 
      </li> 
      <li> 
       <a href="/ci/index.php/adel_ctl/research/<?=$id?>">Reseasrch</a> 
      </li> 
      <li> 
       <a href="/ci/index.php/adel_ctl/teaching/<?=$id?>">Teaching</a></li> 
      </li> 
      <li> 
       <a href="/ci/index.php/adel_ctl/experience/<?=$id?>">Experience</a></li> 
      </li> 
      <li> 
       <a href="/ci/index.php/adel_ctl/publications/<?=$id?>">Publications</a> 
      </li> 
      <li> 
       <a href="/ci/index.php/adel_ctl/resume/<?=$id?>">Resume</a> 
      </li> 
      <li> 
       <a href="/ci/index.php/adel_ctl/about/<?=$id?>">About us</a> 
      </li> 
     </ul> 
    </div>

來源

2014-10-18 Aadil Alshammari

你可以嘗試使用jQuery匹配的網址路徑，並添加「主動」類它：

$(function(){ 
    var this_url = window.location.pathname; 
    var list_sidebar_link = $(".sidebar-nav li a"); 
    $(list_sidebar_link).each(function (i, item) { 
     var the_a = list_sidebar_link[i]; 
     if (this_url == $(the_a).attr('href')) { 
      $(the_a).addClass('active'); 
     } 
    }); 
});

來源

2014-10-18 23:59:38 sanusart

感謝這個幫助，但是請你解釋一下，因爲我從來沒有用過jQuery/js。你提供的代碼，我應該在哪裏添加它？ – 2014-10-19 03:27:12

JQuery是一個JavaScript庫，通過使用HTML選擇器可以幫助編寫更少的代碼。還有更多，但在這種情況下，它解釋了這一點。 http://jquery.com你可以通過添加' '進入部分或在正文標籤上方。之後，將代碼段放在 '但仍然當前標籤不活躍 – 2014-10-19 05:25:11

使sidebar-nav選項卡處於活動狀態？

回答

相關問題