Переключение между двумя разными классами jQuery

Не удается получить следующий код для работы:

$('#changeMode').button().click(function(){
    $('#playfield').toggle(function() {
        $(this).switchClass("gridView","plainView");
    }, function() {
        $(this).switchClass("plainView","gridView");
   });      
});

Я не могу заставить его переключить следующий класс div.

<div id="playfield" class="gridView"></div>

Любые идеи?

EDIT: Я пробовал это:

$('#changeMode').button().click(function(){
    if ($('#playfield').attr('class') == "gridView"){
        $('#playfield').removeClass("gridView");
        $('#playfield').addClass("plainView");
    } else {
        $('#playfield').removeClass("plainView");
        $('#playfield').addClass("gridView");
    }
});

И, похоже, все нормально, что за черт?

Ответ 1

Я не знал о switchClass, возможно, вы думали о toggleClass? В любом случае - у меня был старый код, который использовал это (у меня были некоторые странные проблемы с toggleClass):

$(this).removeClass("gridView").addClass("plainView"); 

or

$(this).toggleClass("gridView plainView");

и наоборот.

Пример:

$('#changeMode').button().click(function(){
    $('#playfield').toggle(function() {
        $(this).toggleClass("gridView plainView");
        //$(this).removeClass("gridView").addClass("plainView"); 
    }, function() { 
        $(this).toggleClass("plainView gridView");
        //$(this).removeClass("plainView").addClass("gridView"); 
   });      
});

Но поскольку другие предложили, чтобы toggleClass работал для ваших нужд.

Ответ 2

Правильный синтаксис - использовать "Один или несколько имен классов (, разделенных пробелами).." (из . toggleClass ( )) в первом параметре вместо цитирования имен классов в первом и втором параметрах.

например.

$(this).toggleClass("gridView plainView");

Ответ 3

jQuery также имеет API toggleClass:

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

Это работает так же, как предложил Рионмонстер, добавляя классы, когда они не установлены в классе и удаляют их, когда они уже установлены.

Ответ 4

просто использовать toggleClass дважды сделает магию. toggoleClass refference для Jquery
This method takes one or more class names as its parameter. In the first version, if an element in the matched set of elements already has the class, then it is removed; if an element does not have the class, then it is added.

как для проблемы с ур.

$('#changeMode').button().click(function(){ $(this).toggleClass('gridView').toggleClass('plainView'); });

Помогите решить проблему ur.

@Guy toggleClass('gridView plainView') это будет фактически альтернативным вариантом <div class="gridView plainView"> and <div class=" ">. и не переключаться между двумя классами. не в обиду. надеюсь, что это поможет.