Can I find events bound on an element with jQuery?

I bind two event handlers on this link:

<a href='#' id='elm'>Show Alert</a>

JavaScript:

$(function()
{
  $('#elm').click(_f);
  $('#elm').mouseover(_m);
});

function _f(){alert('clicked');}
function _m(){alert('mouse over');}

Is there any way to get a list of all events bound on an element, in this case on element with id="elm" ?


In modern versions of jQuery, you would use the $._data method to find any events attached by jQuery to the element in question. Note, this is an internal-use only method:

// 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" );

The result from $._data will be an object that contains both of the events we set (pictured below with the mouseout property expanded):

$ ._的控制台输出

Then in Chrome, you may right click the handler function and click "view function definition" to show you the exact spot where it is defined in your code.


General case:

  • Hit F12 to open Dev Tools
  • Click the Sources tab
  • On right-hand side, scroll down to Event Listener Breakpoints , and expand tree
  • Click on the events you want to listen for.
  • Interact with the target element, if they fire you will get a break point in the debugger
  • Similarly, you can:

  • right click on the target element -> select " Inspect element "
  • Scroll down on the right side of the dev frame, at the bottom is ' event listeners '.
  • Expand the tree to see what events are attached to the element. Not sure if this works for events that are handled through bubbling (I'm guessing not)

  • I'm adding this for posterity; There's an easier way that doesn't involve writing more JS. Using the amazing firebug addon for firefox,

  • Right click on the element and select 'Inspect element with Firebug'
  • In the sidebar panels (shown in the screenshot), navigate to the events tab using the tiny > arrow
  • The events tab shows the events and corresponding functions for each event
  • The text next to it shows the function location
  • 在这里输入图像描述

    链接地址: http://www.djcxy.com/p/49172.html

    上一篇: jquery的追加不与svg元素一起工作?

    下一篇: 我可以通过jQuery找到绑定在元素上的事件吗?