JavaScript/Gli eventi nel BOM: differenze tra le versioni

Contenuto cancellato Contenuto aggiunto
Ramac (discussione | contributi)
m fix - :-P basta conflittarci :D
Ramac (discussione | contributi)
Nessun oggetto della modifica
Riga 27:
* alcuni browser supportano anche l'evento '''onscroll''' che si verifica allo scrolling della pagina
 
== Eventi come attributi HTML ==
Il modo più semplice di definire un evento è quello di inserirlo come '''attributo agli elementi HTML''' della pagina stessa. Ad esempio:
<source lang=html4strict>
<img src="logo.png" width="100px" onclick="alert('hai fatto click sull\'immagine!')" alt="Clicca per apriresaluti" />
</source>
Nell'esempio associamo il codice JavaScript che mostra l'alert al click dell'utente sull'immagine HTML.
 
Ovviamente possiamo anche fare riferimento a funzioni o variabili dichiarate precedentemente nel corso della pagina HTML:
<source lang=html4strict>
<img src="logo.png" width="100px" onclick="salutaUtente()" alt="Clicca per saluti" />
</source>
Tramite questo sistema possiamo usufruire dell'oggetto <code>this</code> per riferirci all'elemento HTML a cui è stato applicato. Ad esempio:
<source lang=html4strict>
<img src="logo.png" width="100px" onmouseover="this.src='logo2.png'" onmouseout="this.scr='logo.png'" alt="rollover" />
</source>
Con questa riga di HTML e qualche istruzione JavaScript creiamo quello che si chiama un ''rollover'', cioè l'effetto di cambiamento dell'immagine quando il mouse passa sopra di essa.
{{Vedi anche|JavaScript/Oggetto document}}
 
== Eventi come proprietà ==
Gli eventi possono essere anche impostati '''tramite il BOM''', cioè tramite JavaScript. Ad esempio:
<source lang=javascript>
window.onload = "alert('pagina in caricamento...');";
</source>
Questo può risultare comodo per aggiungere eventi quando non si possono modificare direttamente gli oggetto HTML, ad esempio nel caso di script esterni creati per essere utilizzati più volte.
 
Attenzione a non incappare in questo tipo di errori:
<source lang=javascript>
function saluta () {
alert("pagina in caricamento");
};
window.onload = saluta(); //non funziona
</source>
In questo codice l'intenzione è quella di mostrare un avviso al caricamento della pagina; scrivendo <code>saluta()</code>, però, il browser lo valuta come funzione; nel nostro caso, poiché tale funzione non restituisce alcun valore, ad caricamento della pagina non succederà nulla. Per corre
 
{{avanzamento|25%}}