Maison  >  Article  >  interface Web  >  Comment désactiver dynamiquement les boutons HTML à l'aide de JavaScript ?

Comment désactiver dynamiquement les boutons HTML à l'aide de JavaScript ?

Linda Hamilton
Linda Hamiltonoriginal
2024-10-23 13:01:30545parcourir

How to Dynamically Disable HTML Buttons Using JavaScript?

Désactivation dynamique des boutons HTML avec JavaScript

La désactivation d'un bouton HTML fait référence à le rendre physiquement non cliquable. Traditionnellement, cela pouvait être réalisé en ajoutant « disabled » à la balise du bouton, sans le définir comme attribut. Cependant, cette approche pose un défi lorsque l'on tente de désactiver le bouton de manière dynamique à l'aide de JavaScript.

Paramètre d'attribut ou de non-attribut

La clé pour comprendre ce problème réside dans la nature du paramètre « handicapé ». Contrairement à ce que vous avez pu entendre, « désactivé » est un attribut. Cependant, les attributs booléens, tels que « désactivé », ont des caractéristiques uniques.

Les attributs booléens en HTML et DOM

Les attributs booléens nécessitent uniquement un nom sans valeur explicite. En HTML 4, il était recommandé de spécifier l'attribut complet ("disabled='disabled'"), mais en HTML 5, il est correct d'omettre la valeur par défaut.

La propriété correspondante dans le DOM (Document Object Model ) est également nommé « désactivé » et accepte les valeurs booléennes (vrai ou faux).

Désactivation dynamique des boutons

Pour désactiver un bouton dynamiquement à l'aide de JavaScript, vous pouvez utiliser l'option syntaxe suivante :

buttonElement.disabled = true;

Vous pouvez également utiliser les méthodes setAttribute et removeAttribute pour manipuler l'attribut "disabled" :

buttonElement.setAttribute('disabled', true);
buttonElement.removeAttribute('disabled');

Cependant, en utilisant le paramètre de propriété directe (buttonElement.disabled ) est préféré pour sa fiabilité, en particulier dans les anciennes versions d'Internet Explorer.

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