Hvordan utløse klikk -hendelsen i JavaScript

Mens vi programmerer i JavaScript, møter vi ofte situasjoner der vi vil påkalle enhver funksjon på knappeklikket. For eksempel, i tilfelle av automatiseringstesting, må du teste noen ekstra funksjonalitet på en webside eller et nettsted. I slike scenarier blir teknikken for å utløse klikkhendelser i JavaScript veldig nyttig og effektiv for å motvirke de uttalte utfordringene.

Denne oppskrivningen vil guide deg om prosedyren for å utløse klikke på hendelser i JavaScript.

Hvordan utløse klikk -hendelsen i JavaScript?

For å utløse klikkhendelse i JavaScript, bruk følgende teknikker:

• “Klikk ()”Metode
• “AddEventListener ()”Og“DispatchEvent ()”Metoder

Nå vil vi demonstrere bruken av de ovennevnte metodene en etter en!

Metode 1: Trigger klikkhendelse i JavaScript ved hjelp av klikk () -metode

“Klikk ()”Metoden brukes til å utføre et klikk på det spesifiserte elementet. Denne metoden kan implementeres ved å lage en knapp, få sin ID og utløse klikkhendelsen når knappen klikkes ved hjelp av en brukerdefinert funksjon.

Gå gjennom følgende eksempel for demonstrasjon.

Eksempel
I det følgende eksempel vil en knapp bli lagt til med å ha "Klikk på meg”Som ID og dens tilknyttede OnClick -hendelse, som vil få tilgang til“clickEvent ()”Funksjon:

Klikk på meg

I JavaScript -kode får du tilgang til den opprettede knappen ved å spesifisere IDen i dokumentet.getElementById () -metode. Etter det vil "klikk ()" -metoden bli påkalt for å utføre den videre driften:

const get = Document.getElementById ('btn');
få.klikk ();

Til slutt, definere funksjonen som heter “clickEvent ()”På en slik måte at den vil skrive ut følgende melding på konsollen når knappen er klikket ved å bruke“Klikk ()”Metode:

funksjon clickEvent ()
konsoll.Logg ("Klikk på hendelsen utløst")

Utgangen fra implementeringen ovenfor vil resultere som følger:

I outputten observeres det at knappen “Klikk på meg”Klikket på en automatisert måte ved å bruke“Klikk ()”Metode. I mellomtiden får du tilgang til ClickEvent ().

Metode 2: Trigger Klikkhendelse i JavaScript ved å bruke “AddEventListener ()” og “DispatchEvent ()” -metoder

“AddEventListener ()”Metode knytter en hendelsesbehandler til et DOM -objekt og“DispatchEvent ()”Metode sender den spesifiserte hendelsen til objektet. Disse metodene kan brukes i kombinasjon for å lage et nytt hendelsesobjekt og utføre klikkhendelsen ved hjelp av den spesifiserte funksjonen.

Syntaks

dokument.AddEventListener (hendelse, funksjon)

I syntaks ovenfor, "begivenhet”Refererer til den spesifiserte hendelsen, og“funksjon”Er funksjonen som hendelsen skal brukes på.

DispatchEvent (hendelse)

Her, “begivenhet”Refererer til det valgte hendelsesobjektet som må sendes ut.

Oversikt Følgende eksempel.

Eksempel
Det første trinnet er å inkludere en knapp med en ID, en OnClick -hendelse og en verdi som diskutert i forrige metode:

Klikk på meg

Hent deretter knappen og legg til hendelsen "Klikk" bruker "AddEventListener ()”Metode og spesifiser“e”I sitt argument som refererer til hendelsen (klikk) -objektet. Og så "DispatchEvent ()”Metode vil sende klikkhendelsen til et objekt som heter“Begivenhet”Som demonstrert:

const get = Document.getElementById ('btn');
få.AddEventListener ('klikk', e => );
få.DispatchEvent (ny hendelse ('klikk'));

Til slutt, definer den samme clickEvent () -funksjonen som angitt i den forrige metoden for å vise den tilsvarende meldingen når "Klikk”Arrangementet utløses:

funksjon clickEvent ()
konsoll.Logg ("Klikk på hendelsen utløst")

Produksjon

Vi har samlet forskjellige metoder for å utløse klikkhendelser i JavaScript.

Konklusjon

For å utløse klikk på hendelser i JavaScript, "Klikk ()”Metode kan brukes for å hente knappen og påkalle den ekstra funksjonen deretter. Også "AddEventListener ()”Og“DispatchEvent ()”Metoder kan brukes til å inkludere en spesifisert hendelse og sende den til et nyopprettet objekt. Denne artikkelen demonstrerte metodene for å utløse klikke på hendelser i JavaScript.