Réponses:
ajoutez simplement l'attribut suivant
// for disabled i.e. cannot highlight value or change
disabled="disabled"
// for readonly i.e. can highlight value but not change
readonly="readonly"
jQuery pour effectuer la modification de l'élément (substitut disabled
pour readonly
dans ce qui suit pour le réglage readonly
attribut).
$('#fieldName').attr("disabled","disabled")
ou
$('#fieldName').attr("disabled", true)
REMARQUE: à partir de jQuery 1.6, il est recommandé d'utiliser à la .prop()
place de .attr()
. Le code ci-dessus fonctionnera exactement de la même manière, sauf .attr()
pour remplacer .prop()
.
Vous pouvez le faire en le marquant simplement disabled
ou enabled
. Vous pouvez utiliser ce code pour ce faire:
//for disable
$('#fieldName').prop('disabled', true);
//for enable
$('#fieldName').prop('disabled', false);
ou
$ ('# fieldName'). prop ('readonly', true);
$ ('# fieldName'). prop ('readonly', false);
--- Il vaut mieux utiliser prop au lieu d'attr.
Utilisez cet exemple pour rendre la zone de texte ReadOnly ou Not.
<input type="textbox" class="txt" id="txt"/>
<input type="button" class="Btn_readOnly" value="Readonly" />
<input type="button" class="Btn_notreadOnly" value="Not Readonly" />
<script>
$(document).ready(function(){
('.Btn_readOnly').click(function(){
$("#txt").prop("readonly", true);
});
('.Btn_notreadOnly').click(function(){
$("#txt").prop("readonly", false);
});
});
</script>
Il existe deux attributs, à savoir readonly
et disabled
, qui peuvent créer une entrée semi-en lecture seule. Mais il y a une petite différence entre eux.
<input type="text" readonly />
<input type="text" disabled />
readonly
attribut rend votre texte d'entrée désactivé et les utilisateurs ne peuvent plus le modifier.disabled
attribut rendra votre texte d'entrée désactivé (non modifiable), mais il ne peut pas non plus être soumis .Approche jQuery (1):
$("#inputID").prop("readonly", true);
$("#inputID").prop("disabled", true);
Approche jQuery (2):
$("#inputID").attr("readonly","readonly");
$("#inputID").attr("disabled", "disabled");
Approche JavaScript:
document.getElementById("inputID").readOnly = true;
document.getElementById("inputID").disabled = true;
PS prop
introduit avec jQuery 1.6
.
Donné -
<input name="foo" type="text" value="foo" readonly />
cela fonctionne - (jquery 1.7.1)
$('input[name="foo"]').prop('readonly', true);
testé avec readonly et readOnly - les deux ont fonctionné.
Peut-être utiliser un attribut désactivé:
<input disabled="disabled" id="fieldName" name="fieldName" type="text" class="text_box" />
Ou utilisez simplement la balise label:;)
<label>
<html xmlns="http://www.w3.org/1999/xhtml">
<head >
<title></title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
</head>
<body>
<div>
<input id="fieldName" name="fieldName" type="text" class="text_box" value="Firstname" />
</div>
</body>
<script type="text/javascript">
$(function()
{
$('#fieldName').attr('disabled', 'disabled');
});
</script>
</html>
Il est peut-être significatif d'ajouter également que
$('#fieldName').prop('readonly',false);
peut être utilisé comme option de bascule.
readonly
attribut à l'élément, quelle que soit la valeur passée. Ainsi, votre exemple finirait par rendre le champ d'entrée en lecture seule, bien que la valeur soit apparemment définie sur false.
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é du sélecteur sinon l'attr = 'disabled' fonctionnait également comme le de la même façon.
Exemples readOnly:
$('input').setReadOnly(true);
ou à travers les différentes coditions comme
var same = this.checked;
$('input').setReadOnly(same);
ici, nous utilisons la valeur booléenne d'état pour définir et supprimer l'attribut en lecture seule de l'entrée en fonction d'un clic sur la case à cocher.
En html
$('#raisepay_id').attr("readonly", true)
$("#raisepay_id").prop("readonly",true);
dans bootstrap
$('#raisepay_id').attr("disabled", true)
$("#raisepay_id").prop("disabled",true);
JQuery est une bibliothèque évolutive et parfois ils apportent des améliorations régulières. .attr () est utilisé pour obtenir des attributs à partir des balises HTML, et bien qu'il soit parfaitement fonctionnel .prop () a été ajouté plus tard pour être plus sémantique et il fonctionne mieux avec des attributs sans valeur comme «vérifié» et «sélectionné».
Il est conseillé que si vous utilisez une version ultérieure de JQuery, vous devez utiliser .prop () chaque fois que possible.