Cómo deshabilitar un botón usando JavaScript

📅 22/01/2025 👤 Julio Fuente 📂 programar

Main Image

Descubra cómo deshabilitar o habilitar programáticamente un botón usando JavaScript

Un botón HTML es uno de los pocos elementos que tiene su propio estado , al igual que casi todos los controles de formulario.

Una cosa común que se necesita es deshabilitar / habilitar el botón programáticamente usando JavaScript.

Por ejemplo, desea habilitar el botón solo cuando se completa un elemento de entrada de texto.

O cuando se hace clic en una casilla de verificación específica, como las que ves que dicen “Leí los términos y condiciones”, algo que en realidad nadie lee.

Aquí te explicamos cómo hacerlo.

Selecciona el elemento mediante document.querySelector()o document.getElementById():

const button = document.querySelector('button')

Si tiene varios botones, es posible que desee utilizarlos document.querySelectorAll()y recorrer los resultados.

De todos modos, una vez que tengas la referencia del elemento, establece su propiedad deshabilitada para truedeshabilitarla:

button.disabled = true

Para volver a habilitarlo, configúrelo en falsepara habilitarlo nuevamente:

button.disabled = false



Tal vez te puede interesar:

  1. Cómo generar un número aleatorio entre dos números en JavaScript
  2. Cómo esperar el evento DOM listo en JavaScript simple
  3. Cómo determinar si una fecha es hoy en JavaScript
  4. Cómo contar el número de propiedades en un objeto JavaScript

Créditos de la imagen http://dbbeebom