domingo, 15 de mayo de 2011

Accediendo a los eventos registrados a través de jQuery para debugging

Cuando queremos debuggear javascript e inspeccionar elementos resulta muy útil utilizar las herramientas de desarrollador que traen incorporadas tanto Firefox (Firebug), IE y Chrome.
Con estas herramientas podemos ver claramente -entre otras cosas- los eventos que los diferentes elementos HTML tienen asociados.
En la siguiente imagen por ejemplo, podemos ver como el input de id “Text1” tiene asociada una función anónima al evento blur() que muestra una alerta.


Sin embargo si registramos el manejador del evento utilizando jQuery, la información que se muestra es la propia de jQuery, que no nos brinda ninguna pista sobre la función que realmente se ejecuta al dispararse el evento.


Para poder ver la información que buscamos, debemos ejecutar la siguiente sentencia en la consola:

$('#Text1').data("events");



Como vemos, esto nos muestra un objeto con la colección de eventos registrados por medio de jQuery para el elemento. Desplegando el evento blur, vemos la función que se llama al  dispararse.
Esto mismo se puede realizar en la consola de Firebug. Para Firefox, existe un plugin adicional llamado Firequery que incorpora esta información directamente en la ventana de inspección al pararnos en el elemento, evitándonos tener que hacer este paso adicional de ingresar a la colección de eventos desde la consola.
Espero les sirva!
Saludos!