Comment activer / désactiver un input en JQuery ?
On peut modifier n'importe quelle propriété, comme la propriété disabled qui désactive ou active un élément de formulaire. Voici comment.
La bibliothèque JavaScript JQuery permet d'interagir facilement avec n'importe quel élément situé sur la page web et facilite l'écriture des fonctions par rapport au JavaScript pur. On peut modifier n'importe quelle propriété, comme la propriété disabled qui désactive ou active un élément de formulaire. L'écriture change en fonction de la version de JQuery utilisée.
A partir de la version 1.6, on utilise la méthode prop() pour modifier la propriété disabled. Il suffit de fixer le deuxième paramètre à true pour désactiver un élément, ou à false pour l'activer.
//Désactive un élément $(input).prop(disabled, true); //Active un élément $(input).prop(disabled, false);
La version 1.6 a introduit une nouvelle méthode removeProp() qui supprime une propriété. Il est cependant recommandé de ne pas l'utiliser pour la propriété disabled car une fois la propriété supprimée, il sera impossible de l'ajouter à nouveau à l'élément. De manière générale, il ne faut pas utiliser la méthode removeProp() pour les propriétés standards d'un élément.
Si vous utilisez la version 1.5 ou une version plus ancienne de JQuery, la méthode prop() n'existe pas encore. Pour ajouter la propriété disabled, on utilise la méthode attr(), qui permet de modifier la valeur de n'importe quel attribut d'une balise HTML. Pour activer un élément, il suffit d'enlever l'attribut avec la méthode removeAttr().
//Désactive un élément $(input).attr(disabled,disabled); //Active un élément $(input).removeAttr(disabled);
Si vous ne travaillez que sur un élément, le sélecteur de JQuery est moins utile. Il est plus rapide d'utiliser du JavaScript pur et de modifier la propriété disabled de l'élément. Pour sélectionner un élément unique, ajoutez un identifiant en HTML et utilisez la méthode document.getElementById().
//Désactive un élément document.getElementById(identifiantDeLElement).disabled = true; //Active un élément document.getElementById(identifiantDeLElement).disabled = false;