Eventi JavaScript

Con JavaScript si ha la possibilità di creare pagine dinamiche. Gli eventi sono quelle azioni che possono essere rilevate da JavaScript.

Ogni elemento di una pagina Web ha alcuni eventi che possono attivare funzioni JavaScript. Ad esempio, possiamo associare all'evento onClick di un pulsante l'attivazione di una certa funzione che verrà eseguita quando un utente fa clic sul pulsante. Gli eventi vengono definiti nei tag HTML di una pagina web.

Esempi di eventi:

• Un click del mouse
• Il caricamento di una pagina web o di un'immagine
• Il passaggio del mouse su uan certa area dela pagina
• La selezione di una casella all'interno di un form
• L'invio di un form HTML
• Un tasto

Nota: Gli eventi sono usati normalmente in associazione alle funzioni, e le funzioni non verrà eseguita prima che l'evento si verifichi.

Alcuni Eventi

Onload  e onUnload

Gli eventi onload e onUnload events vengono attivati quando l'utente entra o esce da una pagina, rispettivamente.

L'evento onload viene spesso usato per effettuare controlli sul tipo/versione di browser usato da un utente, di modo che possa essere caricata la pagina appropriata al browser in uso.

Entrambi gli eventi  (onload  e onUnload) vengono spesso usati  per impostare i cookies quando un utente entra o esce da una pagina web. Ad esempio, si potrebbe avere una finestra  popup che chiede il nome utente al suo primo arrivo alla tua pagina. Il nome viene memorizzato in un cookie. La prossima volta che il visitatore arriva alla tua pagina, si potrebbe avere un altro popup su cui è scritto un messaggio del tipo: " Benvenuto ' Carlo' ".

OnFocus, onBlur  e onChange

Gli eventi onFocus, onBlur e onChange sono spesso usati in combinazione con la validazione dei campi di un form.

Sotto c'è un esempio di come si usa un evento  onChange. La funzione  checkEmail() viene chiamata ogni volta che un utente cambia il contenuto del del campo:

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

 OnSubmit

L'evento onSubmit è usato per la validazione di tutti i campi di un form prima dell'invio.

Sotto c'è un esempio di come si usa l'evento onSubmit. La funzione checkForm() function verrà chiamata quando l'utente clicca sul pulsante d'invio del form. Sei i valori dei campi non sono ammessi, l'invio viene impedito. La funzione checkForm() restituisce i valori vero o falso. Se restituisce il valore true (vero) il form viene inviato, diversamente ( se restituisce il valore falso), l'invio viene cancellato.

<form method="post" action="xxx.htm"
onsubmit="return checkForm()">

OnMouseOver e onMouseOut

Gli eventi onMouseOver e onMouseOut sono spesso usati per creare pulsanti "animati".

Sotto c'è un esempio di un evento onMouseOver. Un messaggio di avviso appare ogni volta che il mouse passa sul pulsante:

<a href="http://www.pagineinrete.it"
onmouseover="alert('Ci si collega al sito pagine in rete');return false">
<img src="button.gif" width="100" height="30">
</a>