Marque champ en lecture seule - case - jQuery

Question

J'ai cette case à cocher:

<input type="checkbox" name="suspended" id="s" value="<?php echo $udata['suspended']; ?>" <?php echo $suspended; ?>> 

Et ce textarea:

<textarea name="suspendreason" id="sr" style="height:60px" class="field"><?php echo $udata['suspendreason']; ?></textarea> 

Ma question est, comment puis-je faire la textarea READONLY chaque fois que la case à cocher #s est non cochée?

Answer 1

Avec votre exigence, quelque chose comme ceci:

$(document).ready(function(){ 
    if($('#s:checked').length){ 
     $('#sr').attr('readonly',true); // On Load, should it be read only? 
    } 

    $('#s').change(function(){ 
     if($('#s:checked').length){ 
      $('#sr').attr('readonly',true); //If checked - Read only 
     }else{ 
      $('#sr').attr('readonly',false);//Not Checked - Normal 
     } 
    }); 
}); 

Answer 2

Vous pouvez le rendre disabled = "désactivé"

Answer 3

Je recommande ce qui en fait lecture seule et les personnes handicapées.

$("#sr").attr('disabled', 'disabled'); 
$("#sr").attr('readonly', 'readonly'); 

simplement parce que si quelqu'un est en Carat en mode navigation, rare, mais oui, j'ai eu des clients ce faire, ils peuvent modifier les champs handicapés.

Et pour la case à cocher:

<script type="text/javascript"> 
    $(document).ready(function() { 
     // check upon loading 
     if(!$("#s").is(:checked)) 
     { 
      $("#sr").attr('disabled', 'disabled'); 
      $("#sr").attr('readonly', 'readonly'); 
     } 

     // event 
     $("#s").change(function() { 
      if(!$(this).is(:checked)) { 
      { 
       $("#sr").attr('disabled', 'disabled'); 
       $("#sr").attr('readonly', 'readonly'); 
      } 
      else 
      { 
       $("#sr").attr('disabled', ''); 
       $("#sr").attr('readonly', ''); 
      } 
     } 
     }); 
</script> 

Answer 4

$("input[type=checkbox][checked]").each( 
    function() { 
     $("#sr").attr("disabled", "disabled") 
    } 
); 

Answer 5

$(document).ready(function() { 
    $("#s").change(function() { 
     if (!this.checked) { 
      $("#sr").attr('disabled', 'disabled'); 
      $("#sr").attr('readonly', 'true'); 
     } 
     else { 
      $("#sr").removeAttr('disabled'); 
      $("#sr").removeAttr('readonly'); 
     } 
    }); 

    //triger change event in case checkbox checked when user accessed page 
    $("#s").trigger("change") 
}); 

Démo de travail - http://jsfiddle.net/cc5T3/1/