1.用的是bootstrap导航
html的结构是
<nav>
<ul>
<li class="active">
<a>
然后有
<a href="/">首页</a>
<a href="/product">产品</a>
<a href="/help">帮助</a>
等等
想实现的效果:点击后跳转到指定页面之后,对应的选项添加一个Class="active"
也就是:比如点了产品页.跳转到产品页,产品页那个就变成
<li class="active"><a href="/product">产品</a></li>
其他选项变成
<li><a href="/...">产品</a></li>
给这个ul增加一个id;通过js判断
//html
<nav>
<ul id="test>
<li class="active"><a href="/">首页</a></li>
<li><a href="/product">产品</a></li>
<li><a href="/help">帮助</a></li>
</ul>
</nav>
//js
$(function(){
$("#test li").click(function() {
$(this).siblings('li').removeClass('active'); // 删除选中的其他兄弟元素的样式
$(this).addClass('active'); // 添加当前元素的样式
});
});