List all bindings of an element (with jQuery)

Is there a way to list all bindings on a jQuery element? jQuery's b开发者_开发知识库ind() does only seem to attach them and I didn't find a jQuery function that does get the bindings.

---

This answer applies to jQuery version < 1.8

Best way to do that, probably the FireQuery plugin for FireFox. Really a neat tool.

If you want/need to accomplish that "in-code", use jQuerys .data('events') object.

$.each($('#element').data('events'), function(i, e) {
    console.log(i, e);
});

All events that were bound via jQuery gets pushed into that object. Of course, there might also be other event handlers like on-anything, for which you would have to check explicitly.

Ref.: FireQuery

---

As of jQuery 1.8 the new syntax is:

$.each($._data("#element", "events"), function(i, e) {
console.log(i, e);
});

Note that it's $._data("#element" NOT $.data($("#element"), so be sure to unwrap your selector if you need to using $myJQuerySelector[0].

Read more...

---

There must be a way to do it programatically, and someone has figured it out and put it in a visual tool.

I'm not sure if this answers your question, but I've found the best tool for determining these bindings is called Visual Event (not a great name, very hard to google actually).

This works in Firefox and Chrome, Chromium, Safari, etc. Some binding issues may happen differently in different browsers. It's good to cover all the bases.

If you have an overlay and need to get underneath an element you can double-click any binding to hide it to get to the event you need to view.

---

Based on the other answers and comments.

JQuery 1.8 and above

var elementSelector = '#element-id';

$(elementSelector).bind('click.test', function(){}); // For testing.

$.each($._data($(elementSelector)[0], 'events'), function(i, e) {
    console.log(i, e);
});

The first argument of $._data() is not jquery object.

Note that this is not a supported public interface; the actual data structures may change incompatibly from version to version. - Jquery 1.8 Realeased

---

Below JQuery 1.8

var elementSelector = '#elementid';

$(elementSelector).bind('click.test', function(){}); // For testing.

$.each($(elementSelector).data('events'), function(i, e) {
    console.log(i, e);
});

In version 1.6, jQuery separated its internal data from the user’s data to prevent name collisions. However, some people were using the internal undocumented “events” data structure so we made it possible to still retrieve that via .data(). This is removed in 1.8.- Jquery 1.8 Realeased

---

The following code looks at an element and all its children and console.logs any bound events.

function findMyEvents(me) {

    if (typeof $._data($(me)[0], 'events') !== "undefined") {
        console.log($(me)[0])
        console.log($._data($(me)[0], 'events'))
        $._data($(me)[0], 'events')
    };
    for (var i = 0; i < $(me).children().length; i++) {
        findMyEvents($(me).children()[i])
    }
}

findMyEvents('body')

---

I cannot make Grinn's answer work. From jQuery 1.8 find event handlers, I think the example should be changed to

var obj = $('#element');
$.each($._data(obj[0], "events"), function(i, e) {
console.log(i, e);
});