Site hosted by Angelfire.com: Build your free website today!

HTML DOM Sündmused

dom.jpg

Sündmused on toimingud mis määratakse JavaScripti abil.

Sündmus

Iga element veebilehel omab teatud sündmusi mis omakorda käivitavad JavaScript funktsiooni. Näiteks kui kasutada onClick sündmust "button" elemendis siis funktsioon hakkab tööle kui kasutaja klikib nupule. Sündmused on seotud HTML märgistega.

Pane tähele. Sündmusi kasutatakse tavaliselt nii, et neid kombineeritakse omavahel funktsioonidega. S. t. et funktsiooni ei saa käivitada enne kui ilmub sündmus.

Vaata ka HTML DOM Sündmuste nimestikku

onload ja onUnload

onload ja onUnload käivituvad siis kui kasutaja siseneb v. lahkub veebilehelt.
onload sündmust kasutatakse tavaliselt kontrollimaks kasutaja brauseri tüüpi ja versiooni. Vastavalt saadud informatsioonile laetakse alla vastav veebilehe versioon.

Samuti kasutatakse onload ja onUnload sündmusi küpsiste (cookies) loomisel; siis kui kasutaja siseneb v. lahkub lehelt. Näiteks mingi lehekülje esmakordsel külastamisel, hüppab välja "pop-up" aken ning küsitakse kasutaja nime v. meiliaadressi. Juhul kui kirjutad "pop-up" aknasse oma nime siis säilitatakse see küpsisena. Järgmisel korral seda sama veebilehte külastades hüppab välja jälle "pop-up" aken kuid seekord umbes sellise tekstiga: " Tere Jälle Juhan!"

onFocus, onBlur ja onChange

onFocus, onBlur ja onChange sündmusi kasutatakse tihti vormingutes saavutamaks kontrolli tekstiväljades tehtud muudatuste üle.
Allpool olevas näites kasutatkse onChange sündmust. Funktsioon checkEmail() käivitub iga kord kui kasutaja teeb muudatusi tekstiväljal:

<input type="text" size="30"
id="email" onchange="checkEmail()">

onMouseOver ja onMouseOut

onMouseOver ja onMouseOut sündmusi kasutatakse tihti "animeeritud" nuppude loomiseks.

Allpool olevas näites on kasutatud onMouseOver sündmust. Hoiatusaken hüppab välja alati kui hiirekursor liigub üle MouseOver sündmuse poolt määratud objekti:

  <a href="http://www.minusait.com"
onmouseover="alert('onMouseOver sündmus');return false">
<img src="pilt.gif" width="100" height="30">
  </a>

Proovi ise:



Punane Nool Vasak Punane Nool