Comment désactiver un bouton à l'aide de JavaScript

Découvrez comment désactiver ou activer un bouton par programmation à l'aide de JavaScript

Un bouton HTML est l'un des rares éléments à posséder le sienEtat. Avec presque tous les contrôles de formulaire.

Une chose courante qui est nécessaire est de désactiver / activer le bouton par programmation à l'aide de JavaScript.

Par exemple, vous souhaitez activer le bouton uniquement lorsqu'un élément de saisie de texte est rempli.

Ou quand une case à cocher spécifique est cliquée, comme celles que vous voyez pour dire «J'ai lu les termes et conditions», quelque chose que personne ne lit réellement.

Voici comment procéder.

Vous sélectionnez l'élément, en utilisantdocument.querySelector()oudocument.getElementById():

const button = document.querySelector('button')

Si vous avez plusieurs boutons, vous voudrez peut-être utiliserdocument.querySelectorAll()et parcourez les résultats en boucle.

Quoi qu'il en soit, une fois que vous avez la référence d'élément, vous définissez sa propriété désactivée surtruepour le désactiver:

button.disabled = true

Pour le réactiver, vous le définissez surfalsepour le réactiver:

button.disabled = false

Téléchargez mon gratuitManuel du débutant JavaScript


Plus de didacticiels sur le navigateur: