JQ 如何设置 class="current"

kevin0216 发布于 2013/07/20 09:26
阅读 4K+
收藏 0

现有如下二级导航菜单,想点击文字后,把一级目录的在对应的class="nav-top-item" 设置成 class="nav-top-item current"   点击二级目录时把<a href="#">标签设置为<a href="#" class="current">

JQ代码如何实现啊?麻烦各位了~望不吝赐教~

<ul id="main-nav">

<li> <a href="#" class="nav-top-item">多媒体 Media</a>

 <ul> 
<li><a href="#">媒体库</a></li> 
<li><a href="#">添加</a></li> 
 </ul> 
</li> 

<li> <a href="#" class="nav-top-item">文章 Post</a> 
 <ul> 
<li><a href="#">写文章</a></li> 
<li><a  href="#">所有文章</a></li> 
<li><a href="#">分类目录</a></li> 
 </ul> 
</li> 
  
<li> <a href="#" class="nav-top-item">页面 Page</a> 
 <ul> 
<li><a href="#">所有页面</a></li> 
<li><a href="#">新建页面</a></li> 
 </ul> 
</li> 

<li> <a href="#" class="nav-top-item">其他 Others</a> 
 <ul> 
<li><a href="#">更新信息</a></li> 
<li><a href="#">联系作者</a></li> 
 </ul> 
</li> 
</ul> 

加载中
0
leo108
leo108
$(document).ready(function(){ 
 $("li a").click(function(){ 
$("li a").removeClass("current"); 
$(this).addClass("current"); 
$(this).parent().parent().prev().addClass("current"); 
}); 
});
kevin0216
kevin0216
很不错,按道理是可行的,谢谢啊~我自己的写法有点问题
0
Photon
Photon
$('ul li a').click(function(){
    $(this).addClass('current');
});
kevin0216
kevin0216
不行撒~
0
kevin0216
kevin0216
$(document).ready(function(){ 
 $("li a").click(function(){ 
$("li a").removeClass("current"); 
$(this).addClass("current"); 


}); 


}); 

我用这个代码,一级目录有效,但点击二级目录后,菜单又收回去了……

kevin0216
kevin0216
谢谢……原来是我点击过后,页面重新加载了……
kevin0216
kevin0216
是的,前台菜单一般是点完就收回,我做了一个竖向的菜单,希望点完了显示当前选项有所不同
彭博
彭博
一般不是点完就菜单关闭了么...
OSCHINA
登录后可查看更多优质内容
返回顶部
顶部