2011-11-20 2 views
1

J'ai jQuery mis ensemble pour changer la mise en évidence sur un conteneur (rouge par défaut, noir à cocher) lorsqu'une case spécifique est cochée. Je pense que ce code pourrait être simplifié, mais je ne sais pas comment. Est-ce que quelqu'un a des idées s'il vous plaît?Jquery changement de classe css sur checkbox changement

$("#container input:checkbox[id=cbTermsAndConditions]").change(function() { 
    if ($(this).attr("checked")) { 
    $('#container').addClass("containerblack"); 
    $('#container').removeClass("containerred"); 
    } else { 
    $(this).parent().addClass("containerred"); 
    $(this).parent().removeClass("containerblack"); 
    } 
}); 

Merci

Répondre

1

peu plus propre:

$("#container input:checkbox[id=cbTermsAndConditions]").click(function() { 
    var $this = $(this); 
    if ($this.attr("checked")) { 
    $('#container').toggleClass("containerblack containerred"); 
    } else { 
    $this.parent().toggleClass("containerred containerblack"); 
    } 
}); 

De plus, vous pouvez obtenir la valeur "checked" avec javascript brut, en remplacement de l'instruction if avec:

if(this.checked) 
+0

Merci. Je ne savais pas que tu pouvais basculer plus d'une classe de CSS. J'ai également changé d'utiliser this.checked. À votre santé. – StuffandBlah

1

Utilisez l'événement click comme la valeur de case à cocher ne change pas et vous pouvez probablement utiliser la classe bascule si tout ce que vous faites est l'ajout et la suppression des classes.