Javascript Events en el DOM
Los eventos javascript son más complicados de lo que uno cree
hay tres modelos importantes que entender
el modelo Tradicional
function hacerAlgo(){
alert('lo hice');
}
obj.onclick= hacerAlgo;
donde los eventos son miembros seteables de un objeto.
Como la mayoria de ustedes sabrá obviamente podemos utilizar funciones anonimas (lambda) para asignar los eventos
obj.onclick= function(){
alert('hizo click')
}
todos los navegadores soportan este modelo de eventos, el unico problema es que no es facil poder contar con el objeto event ni con el objeto que recivió el evento de una manera cross browser debido a la (mala) implementación de IE (trident) veamos un ejemplo
supongamos un elemento div con id="el_div"
var obj = document.getElementById("el_div");
obj.onclick = function (e){
// en la mayoria de los browsers compatibles con
//w3c el parametro e de la funcion posee el objeto event
// en IE el objeto esta en window.event
e = e || window.event;
}
de esta forma tenemos el objeto event en la variable e
gracias a la utilizacion del operador default (||)
el uso del operador default tambien conocido como operador logico OR es muy simple
si el primer operando devuelve un valor truthy (verdaderoso o distinto de null o 0) entonces devuelve el primer operando, de lo contrario devuelve el segundo operando. simple y maravilloso
bueno por ahora les dejo los modelos avanzados en un link pero despues vuelvo con mas comentarios
modelos avanzados segun ppk
hay tres modelos importantes que entender
el modelo Tradicional
function hacerAlgo(){
alert('lo hice');
}
obj.onclick= hacerAlgo;
donde los eventos son miembros seteables de un objeto.
Como la mayoria de ustedes sabrá obviamente podemos utilizar funciones anonimas (lambda) para asignar los eventos
obj.onclick= function(){
alert('hizo click')
}
todos los navegadores soportan este modelo de eventos, el unico problema es que no es facil poder contar con el objeto event ni con el objeto que recivió el evento de una manera cross browser debido a la (mala) implementación de IE (trident) veamos un ejemplo
supongamos un elemento div con id="el_div"
var obj = document.getElementById("el_div");
obj.onclick = function (e){
// en la mayoria de los browsers compatibles con
//w3c el parametro e de la funcion posee el objeto event
// en IE el objeto esta en window.event
e = e || window.event;
}
de esta forma tenemos el objeto event en la variable e
gracias a la utilizacion del operador default (||)
el uso del operador default tambien conocido como operador logico OR es muy simple
si el primer operando devuelve un valor truthy (verdaderoso o distinto de null o 0) entonces devuelve el primer operando, de lo contrario devuelve el segundo operando. simple y maravilloso
bueno por ahora les dejo los modelos avanzados en un link pero despues vuelvo con mas comentarios
modelos avanzados segun ppk
Hola, muy bueno tu blog, espero q siga adelante veo q es nuevito...
ResponderEliminarCon el tema de eventos, estaba viendo q en GMAIL, cuando aparece una direccion de correo, aparece el clasico "mailto:" con parte del href del anchor.
Pero en lugar de levantar el clasico outlook o tu gestor de mail pop3, levanta en ventana aparte una pagina donde nos permite redactar el mail.
Como se puede lograr esto??
eres el idolo dude
ResponderEliminar