更改標籤上的類

Question

我想單擊更改標籤類。

的jsfiddle是在這裏：http://jsfiddle.net/9u8Nc/

得到這個HTML代碼：

<ul class="tags"> 
    <li> <a href="javascript:void(0)" class="tag">Aventure</a> 
    <div class="user-info"> 
     <p><b>Aventure</b> <br> 
     + 2.300 activités</p> 
    </div> 
    </li> 
    <li> <a href="javascript:void(0)" class="tag">Famille</a> 
    <div class="user-info"> 
     <p><b>Famille</b> <br> 
     + 1.500 activités</p> 
    </div> 
    </li> 
    <li> <a href="javascript:void(0)" class="tag">Gourmet</a> 
    <div class="user-info"> 
     <p><b>Gourmet</b> <br> 
     + 500 activités</p> 
    </div> 
    </li> 
</ul> 

當我點擊一個我想要的風格變化。

當我再次點擊它時，我想回到風格。

試試這個，但它不起作用。

$('.tag').click(function() { 
    $(this).addClass('active'); 
}); 

Answer 1

可以使用toggleClass功能：

$('.tag').click(function() { 
    $(this).toggleClass('active'); 
}); 

當你點擊，它設置類，如果沒有設置它，或者如果它的設置將其刪除。

在你的CSS，有

.tag.active 

爲.tag .active更換

.tag .active 

不匹配這兩個類的元素，但在tag類的其他元素與active類的元素。

Demonstration

Answer 2

您可以使用toggleClass

Live Demo

$('.tag').click(function() { 
    $(this).toggleClass('active'); 
});