JavaScript begivenheder

HTML-begivenheder er "hændelser", der sker på HTML-elementer.

Når JavaScript bruges på en HTML-side, kan JavaScript "reagerer" på disse begivenheder.

HTML-begivenheder

HTML-begivenheder kan være noget, som browseren eller brugeren gør.

Nedenfor er nogle eksempler på HTML-begivenheder:

  • HTML-side er fuldt indlæst
  • HTML-indtastningsfeltet ændres
  • HTML-knappen blive klikket

Normalt vil brugeren gerne gøre noget, når en begivenhed sker.

JavaScript lader dig udføre kode, når en begivenhed detekteres.

ved hjælp af JavaScript-kode，HTML tillader dig at tilføje eventhåndterere til HTML-elementer.

brug enkelte anførselstegn:

<element event='nogle JavaScript>

brug dobbelte anførselstegn:

<element event="nogle JavaScript">

I det følgende eksempel:onclick Attributter (og kode) tilføjes til <button> Element:

Eksempel

<button onclick='document.getElementById("demo").innerHTML=Date()'>Hvornår er det nu?</button>

Prøv det selv

I det foregående eksempel, ændrede JavaScript-koden indholdet af elementet med id="demo":

I de følgende eksempler, bruges kode (bruger this.innerHTML）ændrede indholdet af dens egne elementer:

Eksempel

<button onclick="this.innerHTML=Date()">Hvornår er det nu?</button>

Prøv det selv

JavaScript-kode har ofte mange linjer. Det er mere almindeligt at kalde funktioner via event-attributter:

Eksempel

<button onclick="displayDate()">Hvornår er det nu?</button>

Prøv det selv

Almindelige HTML-begivenheder

Nedenfor er nogle almindelige HTML-begivenheder:

begivenhed beskrivelse
onchange HTML-element-er-blivet-ændret
onclick Brugeren klikker på HTML-elementet
onmouseover Brugeren flytter musen hen over HTML-elementet
onmouseout Brugeren flytter musen væk fra HTML-elementet
onkeydown Brugeren trykker på en tast på tastaturet
onload Browseren har fuldført siden laden

En mere omfattende liste:CodeW3C.com JavaScript referencer HTML DOM begivenheder.

Hvad kan JavaScript gøre?

Eventhåndterere kan bruges til at håndtere, validere brugerinput, brugeraktioner og browseraktioner:

  • Handlinger, der skal udføres, når siden laden
  • Handlinger, der skal udføres, når siden lukkes
  • Handlinger, der skal udføres, når brugeren klikker på en knap
  • Indhold, der skal valideres, når brugeren indtaster data
  • og så videre

Der er mange forskellige måder at lade JavaScript håndtere begivenheder på:

  • HTML-begivenhedsattributter kan udføre JavaScript-kode
  • HTML-begivenhedsattributter kan kalde JavaScript-funktioner
  • Du kan tildele HTML-elementer dine egne begivenhedshåndteringsfunktioner
  • Du kan forhindre, at begivenheder sendes eller håndteres
  • og så videre

Du vil lære mere om begivenheder og begivenhedshåndterere i HTML DOM-kapitlet.