导航栏给点击的条目动态增加active

[cxalqq]

各位大佬，我的导航栏目结构如下，怎么实现点击其中任何一个链接，就让此链接或li的class增加active,而其他几个的class中去除active？

<div id="navigation">
<ul class="nav-bar">
<li><a href="/" >aaa</a></li>
<li><a href="xxxxx" >bbb</a></li>
<li><a href="xxxxx">ccc</a></li>
<li>
<a href="#" >MMMM</a>
<ul>
<li><a href="xxxxx">ddd</a></li>
<li><a href="xxxxx">eee</a></li>
</ul>
</li>

</ul>
</div>
<!-- End Navigation -->

我这样写，就老是只有第一个导航条被点击时能够获得active，其他的都没有反应。
$(document).ready(function () {
$('ul.nav-bar').find('a').each(function () {

if (this.href == window.location.href || document.location.href.search(this.href) >= 0) {
$(this).parent().addClass('active');
}
});
});

[zc_1994]

$('.nav-bar li').click(function(){ $('.nav-bar li').removeClass('active'); $(this).addClass('active'); }) 这样试试呢

[Logerlink]

有跳转链接的是不能这样设置active的
因为一跳转链接，页面就会重新初始化，你之前设置的active也就没有作用了
如果没有用框架的话，你可能需要在每个页面的加载事件中为指定的链接设置active才可以

			$(document).ready(function() {
				$(".nav-bar li:eq(2)").addClass('active');		//为第三个li添加active
			});

[zc_1994]

不好意思，我忽略了跳转，如果是跳转的话，你可以直接写死就好了，获取点击一个把链接拼到地址上，然后页面加载的时候判断一下，帮对应的li加上active

[zc_1994]

或者点击一个。。。打错了