单击时的jquery invert class属性

Question

使用这个简单的标记：

<a id="foo" class="first" href="#"></a>

我希望得到这样的东西：

$('#foo').click (function () { 
    if $('foo').hasClass('first') { $('foo').removeClass('first').addClass('second');

    if $('foo').hasClass('second') { $('foo').removeClass('second').addClass('first'); 
});

我不知道之前哪个类有元素，是"first“还是"second”。每次我点击元素，刷新类的读数，怎么可能做到这一点呢？

我希望我说清楚了。

任何帮助都会被感谢。

提前谢谢。

Answer 1

使用toggleClass()一次切换多个类的最佳方法是同时向它传递多个类，如下所示：

$('#foo').click(function() {
  $(this).toggleClass('first second');
});

你可以在这里看到它的工作原理：http://jsfiddle.net/jfriend00/HWkWC/

注意:您可以将多个类传递给toggleClass() (用空格分隔)，它将独立地切换每个类，而不是多次调用toggleClass()。这一切都在toggleClass的jQuery doc中进行了描述。

Answer 2

http://api.jquery.com/toggleClass/

$('#foo').click(function() {
   $(this).toggleClass('first').toggleClass('second');
}