如何在布局上设置活动菜单?

时间:2015-11-20 13:58:59

标签: jquery

所以我有布局和布局我有导航。

<nav>
    <ul>
        <li><a id="whats-on" href="/index#whatson">WHATS' ON</a></li>
        <li><a href="/visiting-us">VISITING US</a></li>
        <li><a href="#">COLLECTIONS & RESARCH</a></li>
        <li><a href="#">LEARNING</a></li>
        <li><a href="#">GET INVOLVED</a></li>

        <li><button class="search" id="search"><img src="images/loupe.png" /></button></li>
    </ul>
</nav>

我试过这个jquery:

$(function() {
     var pgurl = window.location.href.substr(window.location.href
.lastIndexOf("/")+1);
     $("nav ul a").each(function(){
          if($(this).attr("href") == pgurl || $(this).attr("href") == '' )
          $(this).addClass("active");
     })
});

但问题是当页面刷新活动菜单丢失时。有什么建议吗?

2 个答案:

答案 0 :(得分:1)

尝试以下内容。希望这会有所帮助。

$(function() {
 var pgurl = window.location.href;
 $("nav ul li a").each(function(){
      if(pgurl.indexOf($(this).attr("href"))>-1)
          $(this).addClass("active");
 })
});

答案 1 :(得分:0)

试试这个..

替换

$("nav ul a").each(function()

$("nav ul li a").each(function()

希望这会有所帮助......