List all javascript events wired up on a page using jquery

Question

Using jqeury, is it possible to get a list of all the events and to which element the event is bound to?

Answer 1

I bet you could traverse the DOM and inspect the event attribute on each element building up a list... but I've never tried it.

Answer 2

Try using http://docs.jquery.com/Plugins/livequery

Answer 3

Take a look at this question and this one.

Answer 4

jQuery makes this relatively easy because it stores the event handlers in the element data. You should be able to use something like this:

(function($) {
    $.eventReport = function(selector, root) {
        var s = [];
        $(selector || '*', root).andSelf().each(function() {
            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);
            for(var p in e) s.push('\n', p);
            s.push('\n\n');
        });
        return s.join('');
    }
    $.fn.eventReport = function(selector) {
        return $.eventReport(selector, this);
    }
})(jQuery);

and you can call it:

// 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