Begivenheder er handlinger eller hændelser, der sker i systemet. I programmeringsverdenen begivenheder er noget der sker med HTML-elementerne. Men når bruges i HTML-sider, kan den reagere på disse begivenheder. I denne artikel vil vi se, hvad der er de forskellige typer begivenheder i JavaScript, og hvordan fungerer de, i følgende rækkefølge:
Hvad er begivenheder i JavaScript?
Javascript har begivenheder, der giver en dynamisk grænseflade til en webside. Disse begivenheder er forbundet med elementer i Dokumentobjektmodel (DOM).
Disse begivenheder bruger som standard også den boblende udbredelse, dvs. opad i DOM fra børn til forælder. Vi kan binde begivenheder enten som inline eller i et eksternt script. Ved hjælp af JavaScript kan du registrere, hvornår visse begivenheder sker, og få ting til at opstå som reaktion på disse begivenheder.
Typer af begivenheder i JavaScript
Der er forskellige typer begivenheder i der bruges til at reagere på begivenheder. Her vil vi diskutere nogle af de berømte eller mest anvendte begivenheder såsom:
- Onclick
- Onkeyup
- Onmouseover
- Onload
- Onfokus
Så lad os gå videre og se på disse begivenheder i JavaScript med eksempel.
Onclick-begivenhed
Onclick-begivenheden er en musebegivenhed og fremkalder enhver defineret logik, hvis brugeren klikker på det element, den er bundet til. Lad os tage et eksempel og se, hvordan det fungerer:
funktion edu () {alarm ('Velkommen til Edureka!')} Klik på knappenProduktion:
Efter at have klikket på knappen får du følgende advarselsmeddelelse:
Onekeyup-begivenhed
Denne begivenhed er en tastaturbegivenhed, og den bruges til at udføre instruktioner, hver gang en tast frigives efter tryk. Følgende eksempel viser, hvordan begivenheden fungerer:
var a = 0 var b = 0 var c = 0 funktionsændringBackground () {var x = document.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}Produktion:
Når du har skrevet noget, ser det sådan ud:
Onmouseover begivenhed
Onmouseover-begivenheden i JavaScript svarer til at svæve musemarkøren over elementet og dets børn, som det er bundet til. Eksemplet er vist nedenfor:
funktion hov () {var e = document.getElementById ('hover') e.style.display = 'none'}Produktion:
Den farvede boks vises, før den svæver med musen. Så snart du holder musen over boksen, forsvinder den.
sql server integration tjenester tutorial
Onload begivenhed
Onload-begivenheden fremkaldes, når et element indlæses fuldstændigt. Lad os tage et eksempel og se, hvordan det fungerer:
Produktion:
Onfocus begivenhed
Onfocus-begivenheden har en elementliste, der udfører instruktioner, når den får fokus. Følgende eksempel viser, hvordan onfocus-begivenheden fungerer:
funktion fokuseret () {var e = document.getElementById ('input') hvis (bekræft ('Fokus begivenhed')) {e.blur ()}}Fokus i inputboksen:
Produktion:
Dette er nogle af de hyppigst anvendte begivenheder i JavaScript. Med dette er vi kommet til slutningen af vores artikel. Jeg håber, du forstod, hvad der er begivenheder, og hvordan de bruges.
Tjek vores som kommer med instruktørstyret live træning og projektoplevelse i det virkelige liv. Denne træning gør dig dygtig i færdigheder til at arbejde med back-end og front-end webteknologier. Det inkluderer træning i webudvikling, jQuery, Angular, NodeJS, ExpressJS og MongoDB.
Har du et spørgsmål til os? Nævn det i kommentarsektionen på denne blog, så vender vi tilbage til dig.