用jq控制当前页面的公共导航被选中样式

做后台系统的时候，经常会把导航放置在公共模块，这样就需要用js或者jq给当前页面或者跳转后页面对应的导航栏添加选中样式，这样即使刷新页面或者页面跳转以后导航栏选中样式仍然存在有效！

 

      <ul>
        <li class="panel">
            <a href="">1</a>
            <a href="">2</a>
            <a href="">3</a>
        </li>
        <li class="panel">                    
            <a href="">1</a>
            <a href="">2</a>
            <a href="">3</a>        
        </li>
    </ul>

<script>

    $(".panel a").each(function () {

            $this = $(this);

            if ($this[0].href == String(window.location)) {

                $this.addClass("active");  //active表示被选中效果的类名   
                $this.parent(".panel").addClass("active");//如果这个导航是子导航，可以设置被选中这个导航所在的整个导航的展开效果
            }

        });

</script>

转载于:https://my.oschina.net/u/2557443/blog/1580732