assegnare eventi onclick all'onload della pagina

[COMANDANTE SPACE]

ciao a tutti,
brevemente, ho un div con solo immagini dentro (e nodi di testo, che sarebbero gli spazi bianchi tra un elemento img e l'altro),e vorrei una funzione che all'evento window onload,mi assegnasse ad ogni immagine un'azione quando vi si clicca sopra...in pratica voglio fare un guestbook con le faccine (e l'azione separata dalla struttura)


ecco il codice che ho scritto:

<script type="text/javascript">
window.onload= function(){
emo=document.getElementById('emoticons').getElementsByTagName('img');
alert(emo[1].title);
for(var i=0;i<emo.length;i++){
//questa sotto è la riga 97.
emo[i].onclick=function(){document.forms['firma'].elements['messaggio'].value+=emo[i].title};
 }
}
</script>
<div id="emoticons">
	 [img]occhiolino.gif[/img]
	 [img]lingua.gif[/img]
	 [img]sorriso.gif[/img]
</div>
<form name="firma" id="firma" method="post">
<textarea rows="4" cols="40" name="messaggio" id="messaggio" ></textarea>
</form>

tanto per cambiare,non va come dovrebbe...la console di javascript(di firefox) mi dice che "emo[i]has no properties" alla riga 97.....ma due righe più sopra emo[i] è definito,perchè l'alert viene visualizzato....aiuto!!!

[Xinod]

l' alert va in runtime, dove i sarebbe ancora valorizzato correttamente
invece, se non sbaglio, la function() che fai eseguire al click e' fuori dal runtime, il riferimento a emo[i] e' andato perso

standard qui suggerisce un' ottima soluzione, studiala

[COMANDANTE SPACE]

grazie mille...ovviamente funziona,però mi piacerebbe capire un paio di cosette:

function creaListener(ths, funzione) {
//[1]
ths.metodo=function(event){funzione.call(ths,event);};
}

function facci(){
document.forms['firma'].elements['messaggio'].value+=" "+this.title+" "
}

window.onload= function(){
 for(var i=0;i<document.getElementById('emoticons').getElementsByTagName('img').length;i++){
 var faccObj;
faccObj=document.getElementById('emoticons').getElementsByTagName('img')[i];
 creaListener(faccObj,facci);
//[2]
 if(faccObj.attachEvent) faccObj.attachEvent("onclick",faccObj.metodo);
 else if(faccObj.addEventListener) faccObj.addEventListener("click", faccObj.metodo, false);
 }
}
</script>

[1]ths.metodo prende un oggetto e gli aggiunge un metodo.non dovrebbe usare prototype?"event" da dove salta fuori?che significa?
[2]nomeOggetto.onclick non si può proprio usare? ma è supportato dai browser recenti?javascript 1.5 lo prevede?

ancora grazie

[Xinod]

event e' il riferimento all' oggetto event, consiglio l' approfondimento su pro.html.it perche' aiuta a realizzare cose altrimenti difficili/impossibili

nell' economia del tuo script quell' event non viene utilizzato e puoi farne a meno, ma per una funzione versatile e riutilizzabile andrebbe lasciato

x il nomeOggetto.onclick ti dico quel che mi pare di aver capito, se l' elemento esiste nell' html puoi anche usarlo e dovrebbe funzionare
se l' elemento lo crei con i metodi del DOM devi necessariamente appendere il gestore evento con attachEvent/addEventListener
spero sia corretto

[COMANDANTE SPACE]

ok,vado a studiare.
grazie di nuovo

[COMANDANTE SPACE]

ho trovato un modo più comodo per assegnare un evento a più elementi, lo scrivo qui casomai tornasse utile a qualcuno

function facci(){
document.forms['firma'].elements['messaggio'].value+=" "+this.title+" "
}

window.onload= function(){
var immagini=document.getElementById('emoticons').getElementsByTagName('img');
 for(var i=0,elemento;elemento=immagini[i];i++){
 elemento.faccine=facci;//questa è la riga che fa la differenza.
 if(elemento.attachEvent) elemento.attachEvent("onclick",elemento.faccine);
 else if(elemento.addEventListener) elemento.addEventListener("click", elemento.faccine, false);
 }
}