Check if event exists on element

Question

Is there a way to check if an event exists in jQuery? I’m working on a plugin that uses custom namespaced events, and would like to be able to check if the event is bound to an element or not.

@SkylarSaveland Method `$.data(element, "events")` was never official. But in jQuery 1.8.0 this method got left via `$._data(element, "events")`. read more [here](http://blog.jquery.com/2012/08/09/jquery-1-8-released/) — Anton, Aug 19 '12 at 03:10

meder omuraliev · Accepted Answer · 2009-10-03T23:08:16.680

145

$('body').click(function(){ alert('test' )})

var foo = $.data( $('body').get(0), 'events' ).click
// you can query $.data( object, 'events' ) and get an object back, then see what events are attached to it.

$.each( foo, function(i,o) {
    alert(i) // guid of the event
    alert(o) // the function definition of the event handler
});

You can inspect by feeding the object reference ( not the jQuery object though ) to $.data, and for the second argument feed 'events' and that will return an object populated with all the events such as 'click'. You can loop through that object and see what the event handler does.

edited Oct 03 '09 at 23:08

answered Oct 03 '09 at 22:56

meder omuraliev

183,342
71
393
434

3

I actually liked your first example better, the $.data(elem, 'events') supplies much more information. – Corey Hart Oct 03 '09 at 23:04
17

Why don't you just use $('body').data('events')? – James Oct 04 '09 at 13:50
3

gives me an error "$.data($('#myDiv').get(0), "events") is undefined" – zakdances Jan 07 '12 at 10:30
8

This only works for events bound through jQuery's helpers. – Alex Ciminian Feb 18 '12 at 18:00
21

$.data() is not working any more in jQuery >= 1.8. For me $._data() is working in jQuery 1.10.1. See answer of Tom Gerken for a working solution. – jbandi Aug 27 '13 at 21:21
2

I think [this](http://stackoverflow.com/questions/14072042/how-to-check-if-element-has-click-handler/14072162#14072162) is the simplest, non-clumsy and easy to understand way to check if a single element **has the event or not**. – Ganesh Jadhav Jan 08 '14 at 06:39
In this specific case of checking the body element, is it not better to directly write `document.body` in pure-javascript rather than going the jQuery route `$('body').get(0)` ? – WoodrowShigeru Jul 29 '15 at 11:03
important note: $._data when worked that at least an event bind to element. – Saeed Ahmadian May 10 '17 at 08:47

score 97 · Answer 2 · edited Jan 25 '12 at 19:16

97

You may use:

$("#foo").unbind('click');

to make sure all click events are unbinded, then attach your event

edited Jan 25 '12 at 19:16

amurra

15,221
4
70
87

answered May 04 '11 at 14:40

Toni

1,067
7
2

1

Does not help if you have used live to register the event. http://stackoverflow.com/questions/12755646/jquery-datatables-multiple-calls-to-event-handler-with-live-function – Rohit Banga Oct 06 '12 at 04:14
33

Question is to check if event exists on the element and not how to unbind existing events ... – Avi Oct 17 '12 at 18:01
53

@Avi, it's still a good answer, because in many cases the question is asked with the problem in mind: "How not to register a handler twice?" – hans Apr 24 '13 at 19:28
this won't work if you don't want to destroy events registered elsewhere – Galvani Jun 30 '17 at 11:14
8

agree: not a strict answer to the OP but exactly what i needed ;) – tibi Sep 22 '17 at 14:52
1

As of jQuery 3.0, .unbind() has been deprecated. It was superseded by the .off() method since jQuery 1.7, so its use was already discouraged. – Bonez024 Sep 20 '22 at 18:53

Tom G · Answer 3 · 2018-08-30T15:37:13.133

To check for events on an element:

var events = $._data(element, "events")

Note that this will only work with direct event handlers, if you are using $(document).on("event-name", "jq-selector", function() { //logic }), you will want to see the getEvents function at the bottom of this answer

For example:

 var events = $._data(document.getElementById("myElemId"), "events")

or

 var events = $._data($("#myElemId")[0], "events")

Full Example:

<html>
    <head>
        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" type="text/javascript"></script>
        <script>
            $(function() {
                $("#textDiv").click(function() {
                    //Event Handling
                });
                var events = $._data(document.getElementById('textDiv'), "events");
                var hasEvents = (events != null);
            });
        </script>
    </head>
    <body>
        <div id="textDiv">Text</div>
    </body>
</html>

A more complete way to check, that includes dynamic listeners, installed with $(document).on

function getEvents(element) {
    var elemEvents = $._data(element, "events");
    var allDocEvnts = $._data(document, "events");
    for(var evntType in allDocEvnts) {
        if(allDocEvnts.hasOwnProperty(evntType)) {
            var evts = allDocEvnts[evntType];
            for(var i = 0; i < evts.length; i++) {
                if($(element).is(evts[i].selector)) {
                    if(elemEvents == null) {
                        elemEvents = {};
                    }
                    if(!elemEvents.hasOwnProperty(evntType)) {
                        elemEvents[evntType] = [];
                    }
                    elemEvents[evntType].push(evts[i]);
                }
            }
        }
    }
    return elemEvents;
}

Example usage:

getEvents($('#myElemId')[0])

I think you can simplify this by using: var eventBound = (events != null); — George Shaw, May 30 '13 at 23:01
This solution works with jQuery 1.8.0 later. Thank you a lot Ton Gerken :) — Blue Smith, Oct 04 '13 at 04:03
This should be the accepted answer, it handles dynamically applied event handlers, even if the code is a handful. Thank you! — Joosh1337, Oct 02 '19 at 14:46

score 28 · Answer 4 · edited Feb 16 '18 at 04:38

28

use jquery event filter

you can use it like this

$("a:Event(click)")

edited Feb 16 '18 at 04:38

Bhargav Rao

50,140
28
121
140

answered Aug 22 '10 at 12:45

Fareed Alnamrouti

30,771
4
85
76

33

Hah, thanks, built that plugin after getting meder's answer months ago. – Corey Hart Aug 22 '10 at 16:03
22

As of 1.8, this plugin no longer works – Corey Hart Nov 07 '12 at 00:37
8

I love this, posting a plugin OP created as an answer to his question :) – Andy Jan 06 '16 at 21:37

score 5 · Answer 5 · answered Jul 13 '12 at 00:12

5

Below code will provide you with all the click events on given selector:

jQuery(selector).data('events').click

You can iterate over it using each or for ex. check the length for validation like:

jQuery(selector).data('events').click.length

Thought it would help someone. :)

answered Jul 13 '12 at 00:12

rohtakdev

956
1
13
16

3

Not working any more in jQuery >= 1.8. See answer of Tom Gerken for a working solution. – jbandi Aug 27 '13 at 21:20

score 5 · Answer 6 · edited Feb 06 '13 at 11:30

5

I wrote a plugin called hasEventListener which exactly does that.

Hope this helps.

edited Feb 06 '13 at 11:30

Milind Anantwar

81,290
25
94
125

answered Mar 01 '11 at 13:25

Sebastien P.

709
7
6

1

The problem is, how does it work? I've been at it for some hours, and its still not clear. I just want to check if there is a click event on it, and get a boolean back, not an object, but most those methods you provide, at least the examples, are far more complicated. Interestingly: http://www.codingjack.com/playground/jquick/#haseventlistener, but I'm not using jquick, but I like that clean simplicity. – Nicholas Petersen Jul 28 '13 at 06:38

score 0 · Answer 7 · answered Aug 14 '15 at 12:54

This work for me it is showing the objects and type of event which has occurred.

    var foo = $._data( $('body').get(0), 'events' );
    $.each( foo, function(i,o) {
    console.log(i); // guide of the event
    console.log(o); // the function definition of the event handler
    });

score -1 · Answer 8 · answered Feb 14 '13 at 14:00

-1

I ended up doing this

typeof ($('#mySelector').data('events').click) == "object"

answered Feb 14 '13 at 14:00

Gargamel

1,039
1
11
15

Check if event exists on element

8 Answers8

Linked

Related