|
Uno degli eventi più
comuni con cui lavora la maggior parte degli sviluppatori è
sicuramente l'evento onClick che viene generato quando
l'utente fa clic su un oggetto all'interno di una pagina Web.
Chiariamo come l'evento onClick, nella prassi, viene generato
soltanto dopo la pressione e il rilascio del pulsante del mouse. Se
l'utente infatti clicca sul mouse ma non rilascia il pulsante,
l'evento onClick non sarà attivato. Di solito l'evento onClick
viene associato ai pulsanti delle form, come submit e reset.
Vediamo ora un esempio di come possiamo sfruttare le potenzialità
dell'evento onClick
Esempio 5.1
|
<html>
<head></head>
<body>
<form name="esempio">
<input type="button" name="button1"
value="prima"
onclick="document.esempio.button1.value='dopo';"/>
</form>
</body>
</html>
|
Questo esempio ci
consente di modificare con un click del mouse il contenuto del
pulsante "prima". Esso infatti viene modificato in
"dopo".
Esempio 5.2
|
<html>
<head>
<script language="javascript">
function cambia() {
document.esempio.button1.value="dopo";
}
</script>
</head>
<body>
<form name="esempio">
<input type="button" name="button1"
value="prima" onclick="cambia();"/>
</form>
</body>
</html>
|
L'esempio 5.2 ha lo
stesso identico scopo dell'esempio precedente, con la differenza che
è raggiunto in maniera diversa. Prima infatti abbiamo modificato il
contenuto del pulsante aggiungendo l'evento all'interno del tag
HTML, mentre nel secondo esempio abbiamo chiamato una funzione per
svolgere questo compito.
L'evento ondblclick è molto simile all'evento
onClick. Per essere attivato, necessita di un doppio click del
mouse. Un intelligente uso combinato dei due eventi può essere
implementato per attivare contemporaneamente due eventi: infatti,
cliccando due volte sul mouse, verrà attivato prima l'evento
onClick e in seguito l'evento ondblclick.
Lezione
successiva =>
Torna
all'indice
|