Check if on event is handled

Question

How can I check, if a event is handled with .on in jquery?
For example I have added an event handler to the button click event:

$(document).on("click", "#button", function(event)  {
    alert("Handled buttonclick event!");
});

Now I want to check if the event is handled to prevent assigning the same event handler a second time.

Possible duplicate: http://stackoverflow.com/questions/1515069/jquery-check-if-event-exists-on-element — Sumurai8, Sep 13 '13 at 15:22
This is a delegated event handler. It doesn't make sense to add it a second time. In any case, you can `$(document).data('handler-added', true)` to "remember" that you did. — Jon, Sep 13 '13 at 15:24
@Sumurai8 I don't think the method in that answer will work for delegated handlers. — Barmar, Sep 13 '13 at 15:25
@Barmar it should work just fine - it's because the event handler is bound to the document so you need to check the document object - http://jsfiddle.net/B7zS6/ — wirey00, Sep 13 '13 at 15:29
@user2727037 Maybe I'm misunderstanding but all you want to do is check if the element is bound to an event right? — Joe Buckle, Sep 13 '13 at 15:44

score 0 · Answer 1 · answered Sep 13 '13 at 15:26

0

If you want to add a button click once only the you can use one() like,

$("#button").one("click",function(event)  {
    alert("Handled buttonclick event!");
});

or manually you can check by setting a variable like

var countClicked=0;
$(document).on("click", "#button", function(event)  {
    alert("You clicked button "+ (++countClicked) + " times");
});

answered Sep 13 '13 at 15:26

Rohan Kumar

40,431
11
76
106

`.one()` makes the handler only run once, it doesn't mean only one handler. – Barmar Sep 13 '13 at 15:27

wirey00 · Accepted Answer · 2013-09-13T15:38:19.220

Since you are delegating to the document - you need to check the document's event handlers

$._data(document,'events') // will return all event handlers bound to the document

Then you can do check the events you want.. for example click

var events = $._data(document,'events').click; // all click events

$.each(events,function(i,v){ // loop through
    v.selector; // will give you all the selectors used in each delegated event
});

http://jsfiddle.net/B7zS6/

each object will contain the following

Object {type: "click", origType: "click", data: undefined, handler: function, guid: 2…}
data: undefined
guid: 2
handler: function (event) {
namespace: ""
needsContext: false
origType: "click"
selector: "#button"
type: "click"
__proto__: Object

This is assuming your delegated events are bound to the document object though. So in this case you "MUST" know which element the event handler is actually bound to. The other answers will probably work a lot better

so this method would not know about

$('body').on("click", "#button", function(event)  {
    alert("Handled buttonclick event!");
});

or

$('parentelement').on("click", "#button", function(event)  {
    alert("Handled buttonclick event!");
});

And `v.handler` contains the associated handler function. – Barmar Sep 13 '13 at 15:33 — Barmar, Sep 13 '13 at 15:33

Check if on event is handled

2 Answers2