我有一个带有多个标签的侧边栏导航。如何激活/突出显示用户查看的当前选项卡? 我尝试了活跃的课程,但它似乎不断激活一个标签! 任何帮助将不胜感激
以下是我的观点:
<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>
答案 0 :(得分:0)
你可以尝试将url路径与jQuery匹配并添加&#34; active&#34;用它来上课:
$(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');
}
});
});