Come disabilitare una casella di testo se una casella è selezionata usando jQuery?

Voglio disabilitare una casella di testo se un utente deseleziona una casella di controllo e cambia il colore di sfondo della casella di testo. Se l’utente seleziona la casella di controllo, quella casella di testo deve essere modificabile e cambia in colore bianco. Ecco il codice

$(document).ready(function () { $(".ba").click(function () { $(".tex").css("background-color", "#CCCCCC"); }); }); 

Dove .ba è la casella di controllo e .tex è una class di caselle di testo, ora quando l’utente fa clic cambia colore in grigio, ma se fa nuovamente clic il colore non cambia. Voglio vedere se la casella è spuntata se è spuntata succede altro se l’utente deseleziona la casella di controllo, il colore di sfondo della casella di testo dovrebbe cambiare e dovrebbe diventare non modificabile distriggersto. Qualcuno può aiutarti?

Sto usando Below javascript per controllare tutto e deselezionare tutto

 function checkAll(formname, checktoggle) { var checkboxes = new Array(); checkboxes = document[formname].getElementsByTagName('input'); for (var i=0; i<checkboxes.length; i++) { if (checkboxes[i].type == 'checkbox') { checkboxes[i].checked = checktoggle; } } } 

Questo causa qualche problema?

Ecco JS il codice

 $ (". ba"). click (function () {
     if ($ (". ba"). is (": checked")) {
         $ ( "Tex")
             .removeAttr ( "disabilitato")
             .css ("background-color", "white");
     }
     altro {
         $ ( "Tex")
             .attr ("disabilitato", "disabilitato")
             .css ("background-color", "red");
     }
 });

Ti consiglio di controllare l’ API di Jquery . È divertente leggere 🙂

Working jsFiddle Demo

Considera il seguente markup:

   

E il tuo JS:

 $(function () { $('.ba').on('change', function () { var checked = $(this).prop('checked'); $('.tex').prop('disabled', !checked); }); }); 
 $(document).ready(function(){ $(".ba").click(function() { if ($('#check_id').is(":checked")) { $(".tex").css("background-color","#CCCCCC"); } else { $(".tex").css("background-color","#DDDDDD"); } }); }); 

Prova come

 $(".ba").on('click',function() { if($(this).is(':checked')) $(".tex").css("background-color","#CCCCCC"); else $('.tex').prop('disabled', false); })'