Comment activer ou désactiver un bouton en JavaScript ?

Réponses rédigées par Antoine
Dernière mise à jour : 2022-11-17 13:06:20
Thèmes : javascript - bouton
Question

Comment faire pour activer, ou désactiver, un bouton en JavaScript ? C'est à dire lui ajouter ou lui enlever l'attribut disabled ?

Réponse

Pour activer ou désactiver un bouton en JavaScript, il faut lui ajouter, oui supprimer, l'attribut HTML disabled.

Vous pouvez utiliser les fonctions setAttribute et removeAttribute pour effectuer ces actions avec JavaScript.

L'élément setAttribute permet d'ajouter un attribut HTML, et l'élément removeAttribute permet de supprimer un attribut HTML.

Dans l'exemple ci-dessous on identifie le bouton avec la méthode document.getElementById() ; on vérifie ensuite si l'attribue disabled y est présent, et en fonction du résultat (false ou true), on l'ajoute ou on le supprime.

<button onclick="action();">Activer ou désactiver le bouton</button>
<br>
<button id="bouton">Bouton</button>
<script>
function action() {
  const bouton = document.getElementById('bouton');
  if ((bouton.disabled) == false) {
    bouton.setAttribute('disabled', '');
  }
  else bouton.removeAttribute('disabled');
}
</script>

Vous trouverez d'avantage d'information sur les fonctions setAttribute et removeAttribute via cette page du site de Mozilla.