Com desactivar el botó HTML mitjançant JavaScript

Com Desactivar El Boto Html Mitjancant Javascript



A JavaScript, els programadors majoritàriament desactiven el botó d'enviament del formulari per assegurar-se que tots els camps obligatoris s'han omplert abans de l'enviament. A més, ajuda a evitar múltiples enviaments. En determinats casos, és possible que els desenvolupadors vulguin desactivar un botó segons l'estat de l'aplicació o el resultat d'una acció anterior. Per exemple, suposem que un usuari ja ha enviat el formulari o ha realitzat alguna tasca. En aquest cas, desactivareu el ' Presentar ' o el ' completa ” per evitar que l'enviïn o el tornin a completar.

Aquest article il·lustrarà el mètode per desactivar el botó HTML a JavaScript.

Com desactivar el botó HTML amb JavaScript?

Per desactivar un botó HTML mitjançant JavaScript, utilitzeu el ' discapacitat ” propietat de l'element botó. El botó també es desactiva mitjançant l'atribut HTML 'disabled', però es desactivarà permanentment i no el podreu tornar a habilitar. Quan feu servir JavaScript, la propietat 'desactivada' es pot desactivar i activar dinàmicament el botó.







Sintaxi
La sintaxi donada s'utilitza per desactivar el botó:



botóObjecte. discapacitat

Exemple 1: Desactiveu el botó
Creeu un botó en un fitxer HTML i assigneu un identificador ' botó ” que ajudarà a accedir a aquest botó:



< identificador del botó = 'botó' > Botó botó >

Obteniu el botó HTML en un fitxer JavaScript, utilitzant el seu identificador assignat amb l'ajuda de ' getElementById() ” mètode:





era botó = document. getElementById ( 'botó' ) ;

Estableix la propietat ' discapacitat ' a ' veritat ”:

botó. discapacitat = veritat ;

Com podeu veure, el botó de la sortida s'ha desactivat:



Exemple 2: Desactiveu el botó de l'esdeveniment de clic
Aquí, desactivarem el botó mentre hi fem clic. Primer, obteniu la referència del botó utilitzant el seu identificador assignat:

era botó = document. getElementById ( 'botó' ) ;

Truqueu al ' addEventListener() ” mètode adjuntant el “ feu clic ” esdeveniment, que establirà la propietat desactivada “ veritat ” mentre feu clic al botó:

botó. addEventListener ( 'clic' , funció ( ) {
si ( botó. discapacitat ) {
botó. discapacitat = fals ;
}
altra cosa {
botó. discapacitat = veritat ;
}
} ) ;

Es pot observar que mentre es fa clic al botó, es desactiva:

Això es tractava del botó de desactivació de JavaScript.

Conclusió

Per desactivar el botó HTML a JavaScript, utilitzeu ' discapacitat ” propietat de l'element botó. Ajuda a activar o desactivar el botó de manera dinàmica mentre que l'atribut HTML 'desactivat' desactiva el botó permanentment. Aquest article va il·lustrar el mètode per desactivar el botó HTML a JavaScript.