La razón de este post es comprender la lógica de este tipo de "referencia" o de asignación de funciones a la propiedad de un objeto.
Esto viene de este post
Porque no puedo modificar valores de onMouseOut onMouseOver?
El caso es que no se puede asignar una función de una forma lógica como por ejemplo:
Código HTML:
document.getElementById("arrowa1").onmouseout = "alert('test')";
Sin embargo para que funcione el alert('test') debo escribirlo así:
Código HTML:
document.getElementById("arrowa1").onmouseout = function() {alert('test')};
He testeado los comportamientos y creo que es por el manejo deficiente de javascript al tratar diferentes tipos de contenidos, ya sean numericos, texto, boleanos, funciones u objetos. Pero no estoy seguro de esto.
El problema es que si bien function(){alert('test')}; funciona, si la programación exige pasar una variable dentro del alert esta se pierde o funciona de una forma no esperada, por ejemplo:
Código HTML:
function select_this(id) {
var li,file;
for(li=1;li<6;li++)
{
file="square";
if (li==1) file="arrow_left";
if (li==5) file="arrow_right";
document.getElementById("arrow"+li).src="images/"+file+"_blue.png";
document.getElementById("arrowa"+li).onmouseout=function() {alert("valor="+li)};
}
}
en este ejemplo se supondría que
document.getElementById("arrowa"+li).onmouseout
va tomandos los valores de alert("valor="+li)
sin embargo devuelve 6 que es el valor final de li al terminar el bucle.
Saludos y Gracias
PD: no necesito corregir este codigo, solo entender el porque.