la gestione degli eventi per MSIE

Argomenti trattati: l'oggetto event per Microsoft Internet Explorer 

In questa sezione saranno trattate:

Decidiamo di voler esaminare quanto detto servendoci del tag DIV.

Il tag DIV supporta l'evento di mouseover, che si verifica quando il puntatore del mouse passa su un certo elemento, gestito dall'event handler onmouseover.

Inseriamo allora un tag DIV che chiamiamo prove_eventi.

Scriviamo allora:

  <div id="prove_eventi">
        passa il puntatore del mouse qua sopra!
  </div>

Come possiamo dunque richiamare l'evento stabilito?

Ci sono più possibilità per farlo: una è il semplice inserimento del gestore nel tag DIV considerato, che richiami un metodo alert o una funzione definita dal programmatore. Ad esempio:

  <div id="prove_eventi" onmouseover="alert('evento richiamato con la prima modalità')>
        passa il puntatore del mouse qua sopra!
  </div>

Possiamo dunque provare il risultato di quanto descritto:

passa il puntatore del mouse qua sopra!

 

Prendiamo adesso ad esempio il refresh della pagina. Quando si esegue il tasto F5 per MSIE o Ctrl + R per Netscape Navigator (o si spinge l'icona di refresh), viene richiamato il gestore onbeforeunload, proprio dell'oggetto window, eseguito appena prima che l'utente o uno script facciano ricaricare il documento, oppure chiudano una finestra.

function window.onbeforeunload(){
     alert('evento intercettato utilizzando la seconda modalità');
}

provando, si otterrà la seconda finestra di alert.

Infine vi è una terza possibilità, probabilmente meno utilizzata, che è possibile testare con un altro elemento DIV (il cui id sarà prove_eventi2) simile a quello esaminato in precedenza, che per differenziare proviamo con il gestore onclick, che si attiva con un click su un elemento:

clicca col mouse qua sopra!

 

Il codice è il seguente:

 
<script language="JavaScript" for="prove_eventi2" event="onclick">

alert('evento intercettato utilizzando la terza modalità');

</script>

Nel secondo e nel terzo caso, il codice va inserito nel tag <script> ed occorre controllare di scrivere l'evento in minuscolo.

Più in generale, ad ogni evento è sotteso un oggetto event che è rappresentato come un oggetto dell'oggetto window.

Rimandiamo alla guida MSDN per l'elenco completo delle propiretà, di cui esaminiamo quelle di più immediato utilizzo:

Proprietà
altKey restituisce lo stato del tasto Alt (true se premuto, false altrimenti)   
button restituisce il pulsante del mouse eventualmente premuto. Per verificare questa proprietà, riferirsi ai gestori di evento: onmousemove,  onmousedown, onmuoseup.

In generale, riferendosi ad un mouse a 3 tasti, si può seguire lo schema:

0 nessun tasto premuto
1 tasto sinistro
2 tasto destro
3 tasto destro e sinistro
4 tasto centrale
5 tasto sinistro e centrale
6 tasto destro e centrale
7 tasto sinistro, destro e centrale

cancelBubble quando si verifica un evento che può essere propagato tra diversi elementi della gerarchia del DOM, questa proprietà permette di bloccare la catena degli eventi.

esempio

clientX restituisce la coordinata x dell'elemento    
clientY restituisce la coordinata x dell'elemento    
ctrlKey restituisce lo stato del tasto Ctrl (true se premuto, false altrimenti)    
fromElement restituisce l'elemento da cui il mouse si sta spostando a partire dai gestori di evento onmouseover o onmouseout
keyCode restituisce il codice ASCII del tasto premuto (questa proprietà può essere modificata da codice)
offsetX restituisce la coordinata x del puntatore del mouse in relazione all'elemento che ha raccolto l'evento    
offsetY restituisce la coordinata y del puntatore del mouse in relazione all'elemento che ha raccolto l'evento    
returnValue permette di settare il valore di ritorno di un evento (true o false)
screenX restituisce la coordinata x del puntatore del mouse in relazione allo schermo
screenY restituisce la coordinata y del puntatore del mouse in relazione allo schermo
shiftKey restituisce lo stato del tasto Shift (true se premuto, false altrimenti)    
srcElement restituisce l'elemento dal quale è stato raccolto l'evento (il più interno rispetto alla gerarchia del DOM)
toElement restituisce l'elemento su cui il mouse si sta spostando a partire dai gestori di evento onmouseover o onmouseout
type restituisce il tipo di evento come stringa    
x restituisce la coordinata x del puntatore del mouse in relazione ad un'altra finestra
y restituisce la coordinata y del puntatore del mouse in relazione ad un'altra finestra

Torna all'inizio | Home