jQuery在Click上添加Class,但只允许一次。

时间:2012-04-09 15:37:28

标签: javascript jquery

这是我到目前为止所拥有的: enter image description here

使用Javascript:

$(document).ready(function() {
    $(".thumb_wrapper").click(function() {
        $(this).addClass("active");
    });
});

所以这是有效的,它正在添加类,但我希望只有一个项目始终处于活动状态。因此,当我单击某个项目并且它变为活动状态时,我单击的下一个项目应该是新的活动项目,并删除上一个项目。

这有意义吗?我怎么能这样做?

谢谢!

5 个答案:

答案 0 :(得分:12)

您需要先从active元素中删除thumb_wrapper类。试试这个:

$(".thumb_wrapper").click(function() {
    $(".thumb_wrapper").removeClass("active");
    $(this).addClass("active");
});

答案 1 :(得分:3)

首先缓存您的包装并在其上调用 removeClass()

var $wrapper = $(".thumb_wrapper");

$wrapper.click(function() {
    $wrapper.removeClass("active");
    $(this).addClass("active");
});

答案 2 :(得分:1)

$(".thumb_wrapper").on('click', function() {
    $(".thumb_wrapper").removeClass('active').find(this).addClass("active");
});

答案 3 :(得分:0)

这应该这样做。

$(document).ready(function() {
    $(".thumb_wrapper").click(function() {
        $(this).parent().children().each(function() { 
             $(this).removeClass("active");
         });
         $(this).addClass("active");
     });
});

答案 4 :(得分:0)

$(document).ready(function(){
    $('.what').click(function(){
        $('.what').removeClass('active');
        $(this).addClass('active');       
   });       
});

我假设这样的事情?