Catching any click performed using jQuery

Question

the noob way to do it I guess would be

$('*').click(function(){...}); 

But is there any way I can catch any type of click, without having to register a listener for every object in the DOM?

---

Help would be amazing. =)

Answer 1

A click event will by default bubble up the DOM, so you can just attach a click handler to the root, like this:

$(document).click(function() {   //do something }); 

Unless a handler on an element along the way does an event.stopPropagation() or return false, you'll get the click here.

Answer 2

You can use event delegation on the document to catch all clicks.

jQuery will fill the target property of the event to retrieve the clicked element.

$(document).click(function(event){   // event.target is the clicked object }); 

Note that event.target will be the deepest element clicked. Ex: if there is a <span> in a <a>, you will get the <span>, not the <a>.

If you want to catch any click but want to retrieve a specific element (like a class), you can do:

$(document).click(function(event){   $(event.target).closest(".clickable").each(function(){     // "this" is your "clickable" clicked   }); }); 

Unless an event handler on an element along the way does an event.stopPropagation() or return false, you'll get the click here.