JavascriptProva

domenica 29 gennaio 2012

Creare eventi e chiamarli dall'esterno...

La prima parte del codice di cui sopra non serve!
Il fatto che uso addListener aggiunge semplicemente un "ascoltatore" per un evento a un elemento del documento, e basta.

E' come il classico onclick che aggiungo nei tags di ogni elemento della pagina. I vantaggi che sono riuscito a vedere finora sono che la risposta di un elemento a un evento può essere variata a seconda delle esigenze, mettendo o rimuovendo il listener, e che si può aggiungere e togliere il listener a una serie di elementi (dovrebbe esistere anche l'istruzione per rimuoverlo, suppongo!)

Ora invece sono riuscito a far funzionare un codice che crea un evento.
E' piuttosto complicato.

<html>
<head>

<script type="text/javascript">
function evoca(){
 var oggetto=document.getElementById("uno");
 var evento=document.createEvent("MouseEvents")
 evento.initMouseEvent('click', true, true, window, 1, 12, 345, 7, 220, false, false, true, false, 0, null)
 oggetto.dispatchEvent(evento);
}
</script>
</head>

<body>
<div id="uno" style="background:green;width:100px;height:100px" onClick="alert('cliccato')"></div>
<div id="due" style="background:cyan;width:200px;height:100px;position:absolute;left:200px;top:10px" onMouseOver="evoca();"></div>
</body>
</html>
Ecco, in questo codice il DIV "uno" ha già un evento onClick. Il codice che ho marcato in rosso serve a simulare il click su quell'elemento. Tutto qua.
Se poi il codice viene chiamato da un altro evento in un altro elemento, allora posso simulare l'evento stesso, come in questo caso dove simulo un click sul DIV "uno" passando il mouse sul DIV "due".

Nessun commento:

Posta un commento