How to bind to all custom events in jQuery

Question

I know it's not possible to bind to all DOM events and I know you can bind to multiple events by supplying a space-separated list.

But is it possible to bind to all custom events (preferably filtered by a wildcard pattern like 'abc*' or name-space)?

Edit: To clarify, I have created some custom widgets that respond to some custom events. For example, they all handle an event called stepReset and resets their internal models.

After I've written these, I realized events don't bubble down, so the call $(body).trigger('stepReset') basically does nothing. As a result, I am considering adding an umbrella event handler on all widgets' parent elements to propagate all relevant events down.

(I know this is not an elegant solution, but I forgot to tag elements with handlers with a common class, so there's no easy way to use select them all.)

score 7 · Accepted Answer · edited May 23 '17 at 12:02

7

With regards to your upcoming edit, you can retrieve all bound events by accessing the object's data:

var boundEvents = $.data(document, 'events');

From here, you can iterate over the resulting object and check each property for your chosen wildcard character, or iterate over that property's array elements and check the namespace property of each.

For instance,

$.each(boundEvents, function () {
    if (this.indexOf("*"))   // Checks each event name for an asterisk *
        alert(this);

    // alerts the namespace of the first handler bound to this event name
    alert(this[0].namespace); 
});

~~If I understood you correctly,~~ you can iterate over the special events object to get a list of custom events (including those specified in the jQuery source code). Here's an ES5 example, you will need to adapt it yourself for older browsers or use a polyfill for Object.keys:

var evts = Object.keys(jQuery.event.special).join(" ");
$("#myDiv").on(evts, function (e) {
    // your code here
});

edited May 23 '17 at 12:02

Community

1
1

answered Mar 16 '12 at 10:39

Andy E

338,112
86
474
445

In terms of binding to wildcards or a specific namespace though, I guess he'd have to overload `trigger()` and compare the triggered event to the properties of `jQuery.event.special` manually? – Matt Mar 16 '12 at 10:40
@Matt: either that or write a custom function to filter the special events at bind time. – Andy E Mar 16 '12 at 10:43
1

Gotcha, but it seems that custom events [don't get added to `jQuery.event.special`](http://jsfiddle.net/E8ue2/) (in 1.7.1 at least) :( – Matt Mar 16 '12 at 10:47
2

@Matt: I think you're confusing triggering with binding. `jQuery.event.special` is for adding custom event handlers manually, that can be later bound using `bind` or `on`. Events that haven't been defined there can't be bound to. – Andy E Mar 16 '12 at 10:54
1

Ahhh, in which case I think we've interpreted the question differently ;). I thought the OP wanted to be able to do things like; http://jsfiddle.net/E8ue2/1/ – Matt Mar 16 '12 at 10:57
@Matt Yes, that's exactly what I am trying to do. I'll edit the question. – billc.cn Mar 16 '12 at 11:04
@Matt: I guess you were right :-) I've updated my answer with a large arrow pointing in the right direction. – Andy E Mar 16 '12 at 11:24
1

I'm giving you a +1 *just* for **With regards to your upcoming edit**... LOL :P – Matt Mar 16 '12 at 11:27

How to bind to all custom events in jQuery

1 Answers1

Linked