Hva er hendelser i JavaScript, og hvordan de håndteres?

Hendelser er handlinger eller hendelser som skjer i systemet. I programmeringsverdenen, hendelser er noe som skjer med HTML-elementene. Men når brukes på HTML-sider, kan den reagere på disse hendelsene. I denne artikkelen vil vi se hva som er forskjellige typer hendelser i JavaScript, og hvordan fungerer de, i følgende rekkefølge:

• Hva er hendelser i JavaScript?
• Typer av hendelser i JavaScript
  • Onclick-begivenhet
  • Onkeyup-begivenhet
  • Onmouseover-begivenhet
  • Onload-begivenhet
  • Onfocus-begivenhet

Hva er hendelser i JavaScript?

Javascript har hendelser som gir et dynamisk grensesnitt til en webside. Disse hendelsene er knyttet til elementer i Dokumentobjektmodell (DØMMEKRAFT).

Disse begivenhetene bruker som standard boblende forplantning, dvs. oppover i DOM fra barn til foreldre. Vi kan binde hendelser enten som innebygd eller i et eksternt skript. Ved hjelp av JavaScript kan du oppdage når visse hendelser skjer, og få ting til å oppstå som svar på disse hendelsene.

Typer av hendelser i JavaScript

Det er forskjellige typer arrangementer i som brukes til å reagere på hendelser. Her vil vi diskutere noen av de berømte eller mest brukte hendelsene som:

• Ved trykk
• Onkeyup
• Onmouseover
• På Last
• Onfocus

Så la oss gå videre og se på disse hendelsene i JavaScript med eksempel.

Onclick-begivenhet

Onclick-hendelsen er en mushendelse og fremkaller enhver logikk som er definert hvis brukeren klikker på elementet den er bundet til. La oss ta et eksempel og se hvordan det fungerer:

function edu () {alert ('Welcome to Edureka!')} Klikk på knappen

Produksjon:

Etter å ha klikket på knappen får du følgende varselmelding:

Onekeyup-begivenhet

Denne hendelsen er en tastaturhendelse, og den brukes til å utføre instruksjoner når en tast slippes etter at du har trykket på den. Følgende eksempel viser hvordan hendelsen fungerer:

var a = 0 var b = 0 var c = 0 funksjonsendringBakgrunn () {var x = dokument.getElementById ('bg') bg.style.backgroundColor = 'rgb (' + a + ',' + b + ',' + c + ')' a + = 1 b + = a + 1 c + = b + 1 hvis (a> 255) a = a - b hvis (b> 255) b = a hvis (c> 255) c = b}

Produksjon:

Når du har skrevet noe, ser det slik ut:

Onmouseover-begivenhet

Onmouseover-hendelsen i JavaScript tilsvarer å sveve musepekeren over elementet og dets barn, som det er bundet til. Eksemplet er vist nedenfor:

funksjon hov () {var e = document.getElementById ('hover') e.style.display = 'none'}

Produksjon:

Den fargede ruten vises før du holder musepekeren. Så snart du holder musen over boksen, forsvinner den.

Onload-begivenhet

Onload-hendelsen fremkalles når et element er lastet helt. La oss ta et eksempel og se hvordan det fungerer:

Produksjon:

Onfocus-begivenhet

Onfocus-hendelsen har en liste over elementer som utfører instruksjoner når den får fokus. Følgende eksempel viser hvordan onfocus-hendelsen fungerer:

funksjonsfokusert () {var e = document.getElementById ('input') hvis (bekreft ('Focus Event')) {e.blur ()}}
Fokus i inngangsboksen:
 

Produksjon:

Dette er noen av de mest brukte hendelsene i JavaScript. Med dette har vi kommet til slutten av artikkelen vår. Jeg håper du forsto hva som er hendelser og hvordan de brukes.

Sjekk ut vår som kommer med instruktørstyrt liveopplæring og reell prosjektopplevelse. Denne opplæringen gjør deg dyktig i ferdigheter til å jobbe med back-end og front-end web-teknologier. Det inkluderer opplæring i webutvikling, jQuery, Angular, NodeJS, ExpressJS og MongoDB.

salesforce utviklerveiledning for nybegynnere pdf

Har du spørsmål til oss? Vennligst nevn det i kommentarfeltet på denne bloggen, så kommer vi tilbake til deg.