Tiene problemas para hacer funcionar el siguiente código:
$('#changeMode').button().click(function(){ $('#playfield').toggle(function() { $(this).switchClass("gridView","plainView"); }, function() { $(this).switchClass("plainView","gridView"); }); });No puedo hacer que cambie la siguiente clase de div.
<div id="playfield" class="gridView"></div>¿Algunas ideas?
EDITAR: Probé esto:
$('#changeMode').button().click(function(){ if ($('#playfield').attr('class') == "gridView"){ $('#playfield').removeClass("gridView"); $('#playfield').addClass("plainView"); } else { $('#playfield').removeClass("plainView"); $('#playfield').addClass("gridView"); } });Y parece funcionar bien, ¿qué diablos?
No estaba al tanto de un switchClass, ¿quizás estabas pensando en toggleClass? De todos modos, tenía un código antiguo que usaba esto (estaba teniendo algunos problemas extraños con toggleClass):
$(this).removeClass("gridView").addClass("plainView"); or $(this).toggleClass("gridView plainView");y viceversa.
Ejemplo:
$('#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"); }); });Pero como otros han sugerido, toggleClass debería funcionar para sus necesidades.
La sintaxis correcta es usar "Uno o más nombres de clase ( separados por espacios )." (de .toggleClass() ) dentro del primer parámetro, en lugar de citar nombres de clase en el primer y segundo parámetro.
p.ej
$(this).toggleClass("gridView plainView");solo use toggleClass dos veces hará la magia. toggoleClass referencia a 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.
en cuanto a su problema.
$('#changeMode').button().click(function(){ $(this).toggleClass('gridView').toggleClass('plainView'); });
ayuda, esto resolverá tu problema.
toggleClass('gridView plainView') en realidad serán alternativas entre
<div class="gridView plainView"> and <div class=" ">. y no alternar entre las dos clases. sin ofender . Espero que esto sirva de ayuda.