Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>jQuery makes this relatively easy because it stores the event handlers in the element data. You should be able to use something like this:</p> <pre><code>(function($) { $.eventReport = function(selector, root) { var s = []; $(selector || '*', root).andSelf().each(function() { // the following line is the only change var e = $.data(this, 'events'); if(!e) return; s.push(this.tagName); if(this.id) s.push('#', this.id); if(this.className) s.push('.', this.className.replace(/ +/g, '.')); for(var p in e) { var r = e[p], h = r.length - r.delegateCount; if(h) s.push('\n', h, ' ', p, ' handler', h &gt; 1 ? 's' : ''); if(r.delegateCount) { for(var q = 0; q &lt; r.length; q++) if(r[q].selector) s.push('\n', p, ' for ', r[q].selector); } } s.push('\n\n'); }); return s.join(''); } $.fn.eventReport = function(selector) { return $.eventReport(selector, this); } })(jQuery); </code></pre> <p>and you can call it:</p> <pre><code>// all events alert($.eventReport()); // just events on inputs alert($.eventReport('input')); // just events assigned to this element alert($.eventReport('#myelement')); // events assigned to inputs in this element alert($.eventReport('input', '#myelement')); alert($('#myelement').eventReport('input')); // same result // just events assigned to this element's children alert($('#myelement').eventReport()); alert($.eventReport('*', '#myelement'); // same result </code></pre> <p><strong>UPDATE:</strong> I added a count of handlers and some information about delegated events to the output of the above function.</p> <p><strong>UPDATE (8/24/2012):</strong> While the function above still works in jQuery 1.7.2 and lower, jQuery no longer stores the event object in <code>jQuery.data(elem, 'events')</code> and <strong>if you are using jQuery 1.8 or later you will no longer be able to use the function above!</strong></p> <p>In exchange for <code>jQuery.data(elem, 'events')</code> you can now use <code>jQuery._data(elem, 'events')</code>. An update to the function above would look like this:</p> <pre><code>(function($) { $.eventReport = function(selector, root) { var s = []; $(selector || '*', root).addBack().each(function() { // the following line is the only change var e = $._data(this, 'events'); if(!e) return; s.push(this.tagName); if(this.id) s.push('#', this.id); if(this.className) s.push('.', this.className.replace(/ +/g, '.')); for(var p in e) { var r = e[p], h = r.length - r.delegateCount; if(h) s.push('\n', h, ' ', p, ' handler', h &gt; 1 ? 's' : ''); if(r.delegateCount) { for(var q = 0; q &lt; r.length; q++) if(r[q].selector) s.push('\n', p, ' for ', r[q].selector); } } s.push('\n\n'); }); return s.join(''); } $.fn.eventReport = function(selector) { return $.eventReport(selector, this); } })(jQuery); </code></pre> <p><strong>UPDATE (4/25/2013):</strong> <code>andSelf()</code> is deprecated from 1.8.x <a href="http://bugs.jquery.com/ticket/9800" rel="noreferrer">http://bugs.jquery.com/ticket/9800</a> , I replaced with <code>addBack()</code> instead.</p>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. This table or related slice is empty.
    2. VO
      singulars
      1. This table or related slice is empty.
    3. VO
      singulars
      1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload