JS实现页面跳转或者刷新后保留点击添加的class样式

项目中遇到一个问题，点击进行页面的跳转，但是添加的class并没有成功。只是在当前的页面触发生效，进入到新的页面就会失效。经过不断的查阅，终于找到了一个完美的方法，使用url传参数，然后根据参数判断是否有必要显示class。二话不说，直接上代码。
html代码片段：

<ul class="navUl">
    			 <li class="active"><a href="../">首页</a></li>			
                 <li><a href="../tt/index.shtml">头条</a> </li>	
                 <li> <a href="../zx/index.shtml">资讯</a></li>
    			 <li><a href="../hdkd/index.shtml">活动看点</a></li> 				
                 <li><a href="../wzx/index.shtml">微资讯</a></li>  					
</ul>

JS代码片段：

$(document).ready(function(){  
        $(".navUl li a").each(function(){  
            $this = $(this);  
            if($this[0].href==String(window.location)){ 
                $(".navUl li").removeClass("active");
                $this.parent().addClass("active");  //active表示被选中效果的类名   
            } 
        });  
    }); 

这样就可以完美的解决了，希望可以帮助到大家。

最后

以上就是懵懂西牛为你收集整理的JS实现页面跳转或者刷新后保留点击添加的class样式JS实现页面跳转或者刷新后保留点击添加的class样式的全部内容，希望文章能够帮你解决JS实现页面跳转或者刷新后保留点击添加的class样式JS实现页面跳转或者刷新后保留点击添加的class样式所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错，欢迎将靠谱客网站推荐给程序员好友。