Jquery给当前页或者跳转后页面的导航栏添加选中后样式的实例
解决方法有两种：一种是直接给当前页面添加特殊样式，当网页刷新或者跳转到下一页后，样式消失；另一种情况是即使刷新页面后样式仍然有效。
直接上代码：
第一种情况：
<scripttype="text/javascript"src="templets/js/jquery.js"></script>
<scripttype="text/javascript">
$(document).ready(function(){
$(".nava").each(function(){
$(this).click(function(){
$(".nav.hover").removeClass("hover");
$(this).addClass("hover");
returnfalse;//防止页面跳转
});
});
});
</script>
<divclass="nav">
<ul>
<li><ahref="1.html"class="hover">首页</a></li>
<li><ahref="2.html">个人资料</a></li>
<li><ahref="3.html">我的好友</a></li>
<li><ahref="4.html">消息管理</a></li>
</ul>
</div>
第二种情况：
<scripttype="text/javascript"src="templets/js/jquery.js"></script>
<scripttype="text/javascript">
$(document).ready(function(){
$(".nava").each(function(){
$this=$(this);
if($this[0].href==String(window.location)){
$this.addClass("hover");
}
});
});
</script>
<divclass="nav">
<ul>
<li><ahref="1.html">首页</a></li>
<li><ahref="2.html">个人资料</a></li>
<li><ahref="3.html">我的好友</a></li>
<li><ahref="4.html">消息管理</a></li>
</ul>
</div>
以上这篇Jquery给当前页或者跳转后页面的导航栏添加选中后样式的实例就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持毛票票。
热门推荐
4 敏字的祝福语简短
10 入学校简短祝福语
11 女生高级生日祝福语简短
12 求婚文案 祝福语大全简短
13 新年送老师简短祝福语
14 毕业结婚祝福语简短精辟
15 学生祝福语简短古诗句
16 出院家庭花束祝福语简短
17 亲姐姐怀孕祝福语简短
18 毕业祝福语保安文案简短