Hvordan deaktivere HTML -knappen ved hjelp av JavaScript

I JavaScript deaktiverer programmererne stort sett sendeknappen i skjemaet for å sikre at alle nødvendige felt er fylt ut før innsending. Det hjelper også å forhindre flere innleveringer. I visse tilfeller kan det være lurt å deaktivere en knapp basert på applikasjonens tilstand eller utfallet av en tidligere handling. Anta for eksempel at en bruker allerede har sendt inn skjemaet eller utført noen oppgave. I så fall vil du deaktivere “sende inn" eller "fullstendig”-Knappen for å forhindre at de sender inn eller fullfører den igjen.

Denne artikkelen vil illustrere metoden for å deaktivere HTML -knappen i JavaScript.

Hvordan deaktivere HTML -knappen ved hjelp av JavaScript?

For å deaktivere en HTML -knapp ved hjelp av JavaScript, bruk "funksjonshemmet”Egenskapen til knappelementet. Knappen er også deaktivert ved hjelp av HTML “deaktivert” -attributtet, men den vil bli deaktivert permanent, og du vil ikke kunne aktivere den igjen igjen. Mens du bruker JavaScript, kan egenskapen "deaktivert" deaktiveres og aktiveres på knappen dynamisk.

Syntaks
Den gitte syntaks brukes for å deaktivere knappen:

ButtonObject.funksjonshemmet

Eksempel 1: Deaktiver knappen
Opprett en knapp i en HTML -fil og tilordne en ID “knapp”Det vil bidra til å få tilgang til denne knappen:

Knapp

Hent HTML -knappen i en JavaScript -fil, ved å bruke deres tildelte ID ved hjelp av "getElementById ()”Metode:

var knapp = dokument.getElementById ("knapp");

Sett eiendommen “funksjonshemmet" til "ekte”:

knapp.deaktivert = sant;

Som du kan se, har knappen i utgangen blitt deaktivert:

Eksempel 2: Deaktiver knappen på klikkhendelsen
Her vil vi deaktivere knappen mens vi klikker på den. Først må du få referansen til knappen ved å bruke den tildelte ID -en:

var knapp = dokument.getElementById ("knapp");

Ring "AddEventListener ()”Metode ved å knytte“Klikk”Arrangement, som vil sette den funksjonshemmede eiendommen”ekte”Mens du klikker på knappen:

knapp.AddEventListener ("Klikk", funksjon ()
hvis (knapp.funksjonshemmet)
knapp.deaktivert = falsk;

ellers
knapp.deaktivert = sant;

);

Det kan observeres at mens du klikker på knappen, blir den deaktivert:

Det handlet om deaktiverende knappen i JavaScript.

Konklusjon

For å deaktivere HTML -knappen i JavaScript, bruk "funksjonshemmet”Egenskapen til knappelementet. Det hjelper til med å aktivere eller deaktivere knappen dynamisk mens HTML “deaktivert” -attributtet deaktiverer knappen permanent. Denne artikkelen illustrerte metoden for å deaktivere HTML -knappen i JavaScript.