Comment puis-je changer la couleur d’un lorsque son entrée est désactivée?

J’ai des étiquettes comme:

 

qui sont parfois handicapés

 $("#the_name").prop('disabled', true); 

Pas de problème, mais j’aimerais changer la couleur du texte de l’étiquette pour le rendre plus visible. Est-il possible d’utiliser Jquery et / ou CSS?

vous pouvez append une règle css à l’étiquette en sélectionnant le parent de votre entrée et en y ajoutant au moment où vous désactivez le contrôle

 $("#the_name").prop('disabled', true).parent().css({backgroundColor:'#fcc'}); 

De plus, je pense que le label doit être utilisé comme ceci:

   

où l’atsortingbut label for correspond à l’ id du contrôle cible

Dans ce cas, vous pouvez sélectionner le libellé en fonction de son atsortingbut et appliquer css à votre guise – quelque chose comme ceci:

 $("#the_id").prop('disabled', true); $('label[for=the_id]').css({backgroundColor:'#fcc'}); 

Voir le violon pour la démo: http://jsfiddle.net/bq52X/

Cela peut être fait en CSS, mais uniquement lorsque l’étiquette vient après la balise input. Par exemple:

HTML:

  

CSS:

 input[disabled] + label { *whatever style you want when input is disabled* } ; 

Oui, si vous voulez que les entrées désactivées soient libellées dans une couleur différente, vous pouvez append une classe CSS à la .

 $("#the_name").prop('disabled', true).parent('label').addClass('disabled-label'); 

Ensuite, vous contrôlez le style via la feuille de style plutôt que dans le fichier de script ou le fichier html.

Pensez à ne pas insérer l’entrée dans la balise label, car j’ai l’impression que cela vous donne un plus grand contrôle sur les styles.

Je n’ai entendu personne parler d’opacité:

 .css('opacity', '0.5'); 

Une option:

 $("#the_name").parent('label').css('color','silver');