0

我有一个 li 项目我需要更改点击项目的类别如下

  • 从默认类中删除当前类
  • 将当前类添加到单击的类

我的html代码在这里

                <ul class="filter">
                <li><a href="#" title="" class="current">recent</a></li>
                <li><a href="#" title="">top popularity</a></li>
                <li><a href="#" title="">top commented</a></li>
                <li><a href="#" title="">other ...</a></li>

            </ul>

这是完成这项工作的jquery代码

      $(".filter > li a").click(function(){

      $(".filter li a.current").removeClass("current");
        $(this).addClass("current");
      });

它可以完美运行,否则当我单击任何其他链接时,这些链接会将代码应用于它,我只需将此代码应用于 ul.filter

4

4 回答 4

3

可能这会更容易和更简单。它所做的只是删除其兄弟当前类并为其自身添加新的当前类。

$('.filter a').click(function(){
  $(this).addClass('current').siblings().removeClass('current');
});
于 2012-04-04T01:16:31.753 回答
1

这个片段应该适合你!

$('.class a').on('click', function(){
  $('.class a').removeClass('current');
  $(this).addClass('current');
});
于 2012-04-04T01:10:53.613 回答
1

使用 :not() 省略当前项

   $(".filter > li a").not(".current").on('click', function(){
       if(!$(this).hasClass("current")) {
           $(".filter").find("a.current").removeClass("current");
           $(this).addClass("current");
           alert($(this).html());
       }
   });

演示

于 2012-04-04T00:29:08.063 回答
0

如果您希望点击处理仅发生在 ul.filter 中,那么您应该更新您的选择器以反映这一点:

$("ul.filter > li a")

而不是

$(".filter > li a")

如果您有多个具有“过滤器”类的 ul 元素,并且您只想将功能应用于其中一个,那么您应该为该特定 ul 提供一个 id 并更改您的选择器以使用该 id。

于 2012-04-04T00:33:35.733 回答