2010-02-11 77 views
15

我有4个锚,我想添加一个当前类的锚,因为它被点击并从其他3个同时删除类。这是我的代码。我究竟做错了什么?jquery add删除类

if ($("ul#thumb a").hasClass("current") { 
    $("ul#thumb a").removeClass("current"); 
    $(this).addClass("current"); 
}); 

和我的HTML看起来像这样:

<ul id="thumbs"> 
    <li> 
     <!-- intro page navi button --> 
     <a id="t0" class="active" name="t0">The Company</a> 

     <ul class="navi"> 
      <li><a style="display:none"></a></li> 
      <li><a id="t1" name="t1">The Brief</a></li> 
      <li><a id="t2" name="t2">The Solution</a></li> 
      <li><a id="t3" name="t3">The Result</a></li> 
     </ul> 

    </li> 
</ul> 
+0

你的HTML看起来像什么? – Sampson 2010-02-11 16:36:37

+0

什么是不工作?它是不删除类,还是不添加类?此外,这看起来不像jQuery的全部数量。你需要某种'$('ul#thumb a')。click(function(){...});'来包装它。 – 2010-02-11 16:38:58

+0

@Topher我修改了我的帖子以显示我的html – mtwallet 2010-02-11 17:28:43

回答

29

通过使用事件代表团,我们只能绑定所有点击事件的一个处理程序。当点击一个锚(比.current锚等),我们剥去.current锚同级车,使点击锚的新的当前一个:

$("#thumbs").on("click", "a:not(.current)", function (event) { 
    $(".current", event.delegateTarget).removeClass("current"); 
    $(this).addClass("current"); 
}); 
+0

+1 - 好。我编辑的帖子,并没有看到= P – 2010-02-11 16:39:37

+0

@Jonathan我修改了我的帖子来显示我的html – mtwallet 2010-02-11 17:28:06

+0

@Jonathan Sampson'e.preventDefault();'是什么意思? +1顺便说一句 – ant 2010-02-11 17:29:03

0

我认为这将有助于你

$("a").click(function() { 
    $('a').removeClass('current'); 
    var id = $(this).attr('id'); 
    $('#'+id).addClass('current'); 
}); 
+0

你为什么要混合'$'和'jQuery'?你应该选择一个并坚持下去。 – Lix 2014-04-24 13:08:26

+1

对不起,这是错误的..你可以使用一个 – Raghvendra 2014-04-24 13:11:58