JavaScript tapahtumat

HTML-tapahtumat ovat tapahtumia, jotka tapahtuvat HTML-elementillä.

Kun JavaScriptia käytetään HTML-sivulla, JavaScript voi "vastata" näihin tapahtumiin.

HTML-tapahtumat

HTML-tapahtumat voivat olla selaimen tai käyttäjän tekemät jotkut asiat.

Alla on joitakin HTML-tapahtumia:

  • HTML-sivu on ladataan valmiiksi
  • HTML-syöttökenttä on muutettu
  • HTML-painike on painettu

Yleensä, kun tapahtuma tapahtuu, käyttäjä haluaa tehdä jotain.

JavaScript mahdollistaa koodin suorittamisen, kun tapahtuma havaitaan.

JavaScript-koodin avulla，HTML sallii sinun lisätä tapahtumankäsittelijöitä HTML-elementteihin.

käytä yksinkertaisia virgoja:

<element event='joitakin JavaScript>

käytä kaksoisvirgoja:

<element event="joitakin JavaScript">

Seuraavassa esimerkissä:onclick ominaisuudet (ja koodi) lisättiin <button> Elementti:

Esimerkki

<button onclick='document.getElementById("demo").innerHTML=Date()'>Mikä on nykyinen aika?</button>

Kokeile itse

Edellisessä esimerkissä, JavaScript-koodi muutti id="demo" -elementin sisällön.

Seuraavassa esimerkissä, koodi (käyttäen this.innerHTML）muutti oman elementtinsä sisällön:

Esimerkki

<button onclick="this.innerHTML=Date()">Mikä on nykyinen aika?</button>

Kokeile itse

JavaScript-koodi koostuu usein monista riveistä. Tapahtumavaihtoehtojen kutsu funktioita on yleisempää:

Esimerkki

<button onclick="displayDate()">Mikä on nykyinen aika?</button>

Kokeile itse

Yleisiä HTML-tapahtumia

Alla on joitakin yleisiä HTML-tapahtumia:

tapahtuma kuvaus
onchange HTML-elementti on muutettu
onclick Käyttäjä napsauttaa HTML-elementtiä
onmouseover Käyttäjä siirtää hiiren HTML-elementin päälle.
onmouseout Käyttäjä siirtää hiiren pois HTML-elementistä.
onkeydown Käyttäjä painaa näppäintä.
onload Selain on suorittanut sivun lataamisen.

Täydellisempi luettelo:CodeW3C.com JavaScript-referenssikirja HTML-DOM-tapahtumat.

Mitä JavaScript voi tehdä?

Tapahtumankäsittelijät voidaan käyttää käsittelemään, tarkistamaan käyttäjän syöttöä, käyttäjän toimintoja ja selaimen toimintoja:

  • Toiminto, joka tulisi suorittaa, kun sivu ladataan.
  • Toiminto, joka tulisi suorittaa, kun sivu suljetaan.
  • Toiminto, joka tulisi suorittaa, kun käyttäjä napsauttaa painiketta.
  • Sisältö, joka tulisi tarkistaa, kun käyttäjä syöttää tietoja.
  • ja niin edelleen

Eri tapoja, joilla JavaScript voi käsitellä tapahtumia, on monia:

  • HTML-tapahtumamäärittelyt voivat suorittaa JavaScript-koodia.
  • HTML-tapahtumamäärittelyt voivat kutsua JavaScript-funktiota.
  • Voit määrittää HTML-elementille omat tapahtumankäsittelijäsi.
  • Voit estää tapahtuman lähettämisen tai käsittelyn.
  • ja niin edelleen

Opit HTML-DOM-luvusta lisää tapahtumista ja tapahtumankäsittelijöistä.