Cómo deshabilitar el botón HTML usando JavaScript

Cómo deshabilitar el botón HTML usando JavaScript
En JavaScript, los programadores deshabilitan principalmente el botón Enviar en el formulario para garantizar que todos los campos requeridos se hayan completado antes de enviar. Además, ayuda a prevenir múltiples envíos. En ciertos casos, los desarrolladores pueden querer deshabilitar un botón basado en el estado de la aplicación o el resultado de una acción anterior. Por ejemplo, suponga que un usuario ya ha enviado el formulario o ha realizado cualquier tarea. En ese caso, deshabilitará el "entregar" o el "completoBotón para evitar que lo envíen o vuelvan a completarlo nuevamente.

Este artículo ilustrará el método para deshabilitar el botón HTML en JavaScript.

Cómo deshabilitar el botón HTML usando JavaScript?

Para deshabilitar un botón HTML con JavaScript, utilice el "desactivadoPropiedad del elemento de botón. El botón también está deshabilitado utilizando el atributo "deshabilitado" HTML, pero se deshabilitará de forma permanente y no podrá volver a habilitarlo nuevamente. Mientras usa JavaScript, la propiedad "deshabilitada" se puede deshabilitar y habilitar dinámicamente el botón.

Sintaxis
La sintaxis dada se utiliza para deshabilitar el botón:

butotoBject.desactivado

Ejemplo 1: Deshabilitar el botón
Cree un botón en un archivo HTML y asigne una ID "botón"Eso ayudará a acceder a este botón:

Obtenga el botón HTML en un archivo JavaScript, utilizando su ID asignada con la ayuda de "getElementById ()" método:

botón var = documento.getElementById ("botón");

Establezca la propiedad "desactivado" a "verdadero":

botón.discapacitado = true;

Como puede ver, el botón en la salida ha sido deshabilitado:

Ejemplo 2: Deshabilite el botón en el evento de clics
Aquí, deshabilitaremos el botón al hacer clic en él. Primero, obtenga la referencia del botón usando su ID asignada:

botón var = documento.getElementById ("botón");

Llama a "addEventListener ()"Método adjuntando el"hacer clic"Evento, que establecerá la propiedad deshabilitada"verdadero"Mientras hace clic en el botón:

botón.addEventListener ("hacer clic", function ()
if (botón.desactivado)
botón.discapacitado = falso;

demás
botón.discapacitado = true;

);

Se puede observar que al hacer clic en el botón, se deshabilita:

Eso se trataba del botón de desactivación en JavaScript.

Conclusión

Para deshabilitar el botón HTML en JavaScript, use el "desactivadoPropiedad del elemento de botón. Ayuda a habilitar o deshabilitar el botón dinámicamente mientras el atributo HTML "deshabilitado" deshabilita permanentemente el botón. Este artículo ilustra el método para deshabilitar el botón HTML en JavaScript.