Javascript-koodia suoritetaan www-sivulla kahdella eri tavalla: (1) ladattaessa sivua selaimeen ja (2) tapahtumien seurauksena.
Tapahtumat liittyvät dokumentin elementteihin. Tavallisimmat ovat
| Tapahtuma | Attribuutti | Kuvaus |
|---|---|---|
| blur | onBlur= |
Fokus siirtyy elementistä pois (esimerkiksi kursori tekstikentästä). |
| change | onChange= |
Tekstikentän sisältö on muuttunut käyttäjän toimesta. |
| click | onClick= |
Elementtiä (esimerkiksi painiketta) on klikattu hiirellä. |
| focus | onFocus= |
Fokus on siirtynyt elementtiin (esimerkiksi kursori tektikenttään). |
| load | onLoad= |
Sivu ladataan selaimeen. |
| mouseover | onMouseover= |
Hiiren osoitinta siirrellään elementin päällä. |
| select | onSelect= |
Kaavakkeen tekstikenttä on valittu hiirellä osoittamalla tai tabulaattoria näppäilemällä. |
| submit | onSubmit= |
Kaavaketta ollaan lähettämässä ('submit'-painiketta osoittamalla). |
| unload | onUnload= |
Käyttäjä poistuu sivulta. |
Tapahtuman seurauksen suoritettava koodi sijoitetaan tapahtumaa vastaavan attribuutin arvoksi. Atrribuuttiin voi laittaa melkein mitä tahansa Javascript-koodia, mutta tavallista on, että koodi on funktion kutsu. Silloin varsinainen toiminta tehdään erillisessä funktiossa.
Esimerkki: Klikkaa hiirellä mihin tahansa kohtaa sivua. Tapahtumaan liittyvän
event-olion ominaisuudet tulevat oikealla olevaan tekstikenttään.
|
Edelliseen esimerkkiin tarvittiin funktio:
<script type="text/javascript">
function nayta_tiedot(e) {
var tiedot = "";
for (var i in e) {
var arvo = eval("e." + i);
tiedot += "event." + i + " = " + arvo + "\n";
}
document.form1.naytto.value = tiedot;
}
</script>
jota kutsutaan body tagissa:
<body onClick="nayta_tiedot(event)">
Lisäksi tarvitaan kaavake:
<form name="form1" onsubmit="return false"> <textarea rows="10" cols="50" name="naytto" readonly="true"></textarea> </form>
Jarkko Leponiemi 19.3.2002