¿Puedo encontrar eventos vinculados a un elemento con jQuery?
Vinculo dos controladores de eventos en este enlace:
<a href='#' id='elm'>Show Alert</a>
JavaScript:
$(function()
{
$('#elm').click(_f);
$('#elm').mouseover(_m);
});
function _f(){alert('clicked');}
function _m(){alert('mouse over');}
¿Hay alguna forma de obtener una lista de todos los eventos vinculados a un elemento, en este caso al elemento con id="elm"?
En las versiones modernas de jQuery, usarías el $._datamétodo para buscar cualquier evento adjunto por jQuery al elemento en cuestión. Tenga en cuenta que este es un método exclusivo para uso interno:
// Bind up a couple of event handlers
$("#foo").on({
click: function(){ alert("Hello") },
mouseout: function(){ alert("World") }
});
// Lookup events for this particular Element
$._data( $("#foo")[0], "events" );
El resultado $._dataserá un objeto que contiene ambos eventos que configuramos (que se muestran a continuación con la mouseoutpropiedad expandida):
Luego, en Chrome, puede hacer clic derecho en la función del controlador y hacer clic en "ver definición de función" para mostrarle el lugar exacto donde está definida en su código.
Caso general:
- Pulsa F12para abrir las herramientas de desarrollo
- Haga clic en la
Sourcespestaña - En el lado derecho, desplácese hacia abajo
Event Listener Breakpointsy expanda el árbol. - Haga clic en los eventos que desea escuchar.
- Interactúa con el elemento objetivo; si se activan, obtendrás un punto de interrupción en el depurador.
Del mismo modo, puedes:
- haga clic derecho en el elemento de destino -> seleccione "
Inspect element" - Desplácese hacia abajo en el lado derecho del marco de desarrollo, en la parte inferior está "
event listeners". - Expanda el árbol para ver qué eventos están asociados al elemento. No estoy seguro si esto funciona para eventos que se manejan mediante burbujeo (supongo que no)
