关于利用JQuery设置li的class的问题

如:
[code="html"]


  • home

  • about


    • [/code]

      上述HTML片断,想通过JQuery实现:

    • about
    • 效果。
      还望 朋友给予帮助,谢谢。
      [b]问题补充:[/b]
      Sorry~先要对两位朋友的热情帮助表示感谢,看了回复后才发觉自己的疏忽没有把问题说明清楚,真是抱歉。

      实现的效果其实应该是这样的,如果我点击了“about”那个链接并跳转到那个页面后,这时把li的class设为"current"。就是当前在哪个页面就把对应的那个li项设为current。

      [b]问题补充:[/b]
      [code="javascript"]

      // 设置菜单选中项的样式 $(function() { $("#menu a[href='/About']").addClass('current'); });

      [/code]

      我是要在about页面上写啊。上述代码把class增加到a标签里了。我一直没法把弄到li里。
      [b]问题补充:[/b]
      哦,忘了说明,因为那个li的菜单代码是放置在了.net“母版页”中。
      所以我就不能象楼下朋友说的那个直接加上一个current。
      [b]问题补充:[/b]

      呵~好像把问题复杂化了,简言之就是 如何实现设置a链接值为"/about"的li的class。

5个回答

$("#menu a[href='/About']").parent("li").addClass('current');

$("#menu li:eq(2)").addClass("current")

楼上的是可以实现效果,但感觉不好。
因为li随时都有可能扩展增加 。
你这样写等于是定死了。

而且楼主的意思明显是这个class加的li不确定

是点击哪个li,就把class加到哪个li上面。

jQuery("#menu li").mouseover(
funcion(){
jQuery(this).toggleClass("current");
}
);

jQuery("#menu li").mouseout(
funcion(){
jQuery(this).toggleClass("current");
}
);

加上这个,就可以实现鼠标移上去 和 移走时候 移除和添加class的效果了。

PS: 是jQuery(this)还是this忘记了,忘记传进来的是dom对象还是jQuery对象了,
你自己试下,不是jQuery(this)就是this

呵呵,如果是鼠标移动的效果的话,那也可以

$("#menu li").hover(
function(){
$(this).addClass("current");
},
function(){
$(this).removeClass("current");
}
);

楼上的写法没错,不过jquery的精髓在于链式语法,你可以

jQuery("#menu li")
.mouseover(
funcion(){
jQuery(this).toggleClass("current");
}
).mouseout(
funcion(){
jQuery(this).toggleClass("current");
}
);

toggle是切换class,虽然你的写法可以达到效果,但是逻辑有点问题,比如说一个li原先有current,那么你鼠标移动上去就会把current给去掉,而移出来却把class又给加上去.

:oops: :oops:

跳转后页面已经刷新了..JavaScript是没办法这么做滴...

你直接在about的页面上加上一个current就好了...不用费这么大劲..

Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
立即提问