Comment puis-je utiliser jQuery pour effectuer une entrée en lecture seule?

J’ai l’entrée suivante:

 

Comment utiliser jQuery pour faire de cet élément une entrée en lecture seule sans modifier l’élément ou sa valeur?

Ces jours-ci avec jQuery 1.6.1 ou supérieur, il est recommandé d’utiliser .prop () lors de la définition des atsortingbuts / propriétés booléens.

 $("#fieldName").prop("readonly", true); 

ajoutez simplement l’atsortingbut suivant

 // for disabled ie cannot highlight value or change disabled="disabled" // for readonly ie can highlight value but not change readonly="readonly" 

jQuery pour apporter la modification à l’élément (substitut disabled pour readonly dans ce qui suit pour définir l’atsortingbut readonly ).

 $('#fieldName').attr("disabled","disabled") 

ou

 $('#fieldName').attr("disabled", true) 

REMARQUE: à partir de jQuery 1.6, il est recommandé d’utiliser .prop() au lieu de .attr() . Le code ci-dessus fonctionnera exactement de la même manière, à l’exception du substitut .attr() pour .prop() .

Pour faire une entrée en lecture seule, utilisez:

  $("#fieldName").attr('readonly','readonly'); 

pour le rendre utilisable en lecture / écriture:

 $("#fieldName").removeAttr('readonly'); 

L’ajout de l’atsortingbut disabled n’enverra pas la valeur avec post.

Vous pouvez le faire simplement en le marquant disabled ou enabled . Vous pouvez utiliser ce code pour faire ceci:

 //for disable $('#fieldName').prop('disabled', true); //for enable $('#fieldName').prop('disabled', false); 

— Il est préférable d’utiliser prop au lieu de attr.

Utilisez cet exemple pour créer une zone de texte ReadOnly ou Not.

     

Peut-être utiliser asortingbute désactivé:

  

Ou utilisez simplement une étiquette:

  
       

Peut-être est-il utile d’append aussi que

 $('#fieldName').prop('readonly',false); 

peut être utilisé comme une option de bascule ..

Dans JQuery 1.12.1, mon application utilise du code:

$('"#raisepay_id"')[0].readOnly=true;

$('"#raisepay_id"')[0].readOnly=false;

et il fonctionne.

Le setReadOnly (state) est très utile pour les formulaires, nous pouvons définir n’importe quel champ sur setReadOnly (state) directement ou à partir de diverses conditions. Mais je préfère utiliser readOnly pour définir l’opacité sur le sélecteur de la même façon.

exemples readOnly:

 $('input').setReadOnly(true); 

ou à travers les différentes codifications comme

 var same = this.checked; $('input').setReadOnly(same); 

Ici, nous utilisons la valeur booléenne state pour définir et supprimer l’atsortingbut readonly de l’entrée en fonction d’un clic sur une case à cocher.

En html

 $('#raisepay_id').attr("readonly", true) $("#raisepay_id").prop("readonly",true); 

en bootstrap

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

JQuery est une bibliothèque évolutive et apporte parfois des améliorations régulières. .attr () est utilisé pour obtenir des atsortingbuts des balises HTML et, bien qu’il soit parfaitement fonctionnel, .prop () a été ajouté plus tard pour être plus sémantique et fonctionne mieux avec des atsortingbuts sans valeur comme ‘checked’ et ‘selected’.

Il est conseillé que si vous utilisez une version ultérieure de JQuery, vous devez utiliser .prop () chaque fois que possible.