Maison >interface Web >js tutoriel >Quelle est la méthode optimale pour désactiver et activer des éléments avec jQuery : prop() vs attr() pour les attributs booléens ?

Quelle est la méthode optimale pour désactiver et activer des éléments avec jQuery : prop() vs attr() pour les attributs booléens ?

Susan Sarandon
Susan Sarandonoriginal
2024-10-19 19:12:30810parcourir

What's the Optimal Method for Disabling and Enabling Elements with jQuery: prop() vs. attr() for Boolean Attributes?

Comment désactiver et activer efficacement des éléments à l'aide de jQuery : comprendre la différence entre attr() et prop()

Problème :

Vous essayez initialement de désactiver les entrées, puis de les activer lorsqu'un lien est cliqué, mais votre solution jQuery actuelle ne fonctionne pas.

HTML :

<code class="html"><input type="text" disabled="disabled" class="inputDisabled" value=""></code>

jQuery :

<code class="javascript">$("#edit").click(function(event){
   event.preventDefault();
   $('.inputDisabled').removeAttr("disabled")
});</code>

Cause :

Vous utilisez removeAttr() pour supprimer l'attribut "disabled", mais cette approche a des limites, notamment avec les attributs booléens comme "disabled".

Solution : utiliser prop() au lieu de attr()

Pour les attributs booléens, il est recommandé d'utiliser la méthode prop() au lieu de attr(). Cette méthode modifie explicitement la valeur de la propriété sous-jacente de l'élément, ce qui est plus efficace et plus approprié pour les attributs booléens.

JQuery mis à jour :

<code class="javascript">$("#edit").click(function(event){
   event.preventDefault();
   $('.inputDisabled').prop("disabled", false); // Element(s) are now enabled.
});</code>

Pourquoi prop() sur attr() pour les attributs booléens ?

  • Cohérence : prop() définit systématiquement la valeur de la propriété, tandis que attr() peut conduire à un comportement inattendu dans certaines situations.
  • Précision : prop() récupère et définit la valeur réelle de la propriété, tandis que attr() peut renvoyer ou définir une valeur différente en fonction de l'attribut.
  • Efficacité : prop() est plus efficace pour les attributs booléens, car il modifie directement la propriété sans impliquer l'attribut.

Remarque : Dans les versions antérieures de jQuery à 3.0, removeAttr() sur un attribut booléen définirait également la propriété correspondante sur false. Ce comportement a été obsolète dans les versions ultérieures, soulignant l'importance d'utiliser prop() pour les attributs booléens.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn