Co je to vlastně událost ?
Událost je okamžik, kdy uživatel udělá určitou věc, například pohne myší. Počítač pohyb zachytí a windows zavolá zvolenou funkci javascriptu.
Nemusí se však vždy jednat o okamžik, který vyprovokuje uživatel, může tím okamžikem být právě už použité ONLOAD (viz minulá lekce)
onload (po nahrátí)
Definice této události je velice jednoduchá:
<body onload="alert('stranka se nahrala')">
Použití je jasné rovněž z předchozí lekce. Jen dodávám, že zde jsem u alert použil jednoduché uvozovky, protože dvojité by rozdělili řetězec a vznikla by chyba (tak jak se v matematice pro názornost používá více druhů závorek, musí být jasné co kde začíná a kde končí).
onmouseover (po najetí kurzoru myši na objekt)
Tato událost nastane, pokud uživatel najede kurzorem na zvolený objekt na stránce (tlačítko, obrázek,...).
Aby prohlížeč věděl, na jaký objekt událost použít, musíme událost definovat v daném objektu:
<html>
<body>
<img onmouseover="alert('najel na obrazek')"><br>
<input type="button" onmouseover="alert('najel na tlacitko')"><br>
<input type="text" onmouseover="alert('najel na textove pole')"><br>
</body>
</html>
onmouseout (po "sjetí" kurzoru myši z objektu)
Tato událost funguje přesně obráceně, než předchozí. Událost nastane, pokud uživatel "sjede" z objektu na stránce.
<html>
<body>
<img onmouseout="alert('opustil obrazek')"><br>
<input type="button" onmouseout="alert('opustil tlacitko')"><br>
<input type="text" onmouseout="alert('opustil textove pole')"><br>
</body>
</html>
onclick (po kliknutí)
No a konečně tato událost nastane, pokud uživatel klikne.
V následujícím příkladu si ukážeme, jak zkombinovat všechny tři události, které reagují na myš.
<html>
<body>
<img onclick="alert('klikl na obrazek')" onmouseover="alert('najel na obrazek')" onmouseout="alert('opustil obrazek')"><br>
</body>
</html>
Další událost pro myš je onmousemove. Tato událost však pro vás nemá v tuto chvíli praktické využití, takže se jí nebudeme věnovat (nikomu v tom ale nebráním, použití je zřejmé z názvu události)