2010-07-22 5 views
3

css Je suis très nouveau sur jquery, aujourd'hui j'ai essayé ce code suivantjquery case changement

$("#new").click(function() { 
    $('#new:checked').closest('p').css('color', 'white'); 
}); 

cela fonctionne très bien, quand je clique sur la case à cocher, mais quand je Décochez la case à cocher, il ne change pas de retour à la couleur d'origine retour ..

comment puis-je atteindre l'état précédent de css après je décoche?

merci

Répondre

9
$("#new").click(function() { 
    $(this).closest('p').css('color', this.checked?'white':'blue'); // just change the blue for your preference.... 
}); 

, mais je vous suggère d'utiliser la classe ..

$("#new").click(function() { 
    if (this.checked){ 
     $(this).closest('p').addClass('white'); 
    } else { 
     $(this).closest('p').removeClass('white'); 
    } 
}); 

ou

$("#new").click(function() { 
    $(this).closest('p').toggleClass('white',this.checked); 
}); 

vous devriez avoir une définition de ce css comme

.white { 
    color: white; 
} 
+0

bravo, a travaillé. merci – damien

+0

Cela a fonctionné pour moi aussi j'ai dû l'adapter légèrement à mes besoins, mais cela a résolu un problème que je ne savais même pas que j'avais. – gcoulby

1
$("#new").toggle(function() { 
    $('#new:checked').closest('p').css('color', 'white'); 
}, function() { 
    $('#new:checked').closest('p').css('color', 'black'); 
}); 

Vous pouvez faire ce que vous voulez changer. Même vous pouvez vérifier si la case à cocher est cochée ou non. Sinon, si vous connaissez l'état de chargement de la case à cocher et si c'est toujours la même chose, aucune vérification de 'checked' n'est requise.

0

Ne pas ajouter quelque chose de nouveau, tout, y compris d'une manière plus succincte au même résultat:

$("#new").click(function() { 
    var color = "black"; 
    if($(this).is(':checked')) color = "white"; 
    $(this).closest('p').css('color', color); 
});