web-dev-qa-db-fra.com

Attraper n'importe quel clic effectué avec jQuery

la façon noob de le faire, je suppose serait

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

mais y a-t-il un moyen de capter un type de clic, sans avoir à enregistrer un auditeur pour chaque objet de la DOM?


Aider serait incroyable. =)

28
RadiantHex

Un événement click sera par défaut Bubble up the DOM , afin que vous puissiez simplement joindre un gestionnaire click à la racine, comme ceci:

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

Sauf si un gestionnaire sur un élément en route fait une event.stopPropagation() ou return false, Vous aurez le clic ici.

32
Nick Craver

Vous pouvez utiliser la délégation d'événements sur le document pour attraper tous les clics.

jQuery remplira la propriété target de la propriété event pour récupérer l'élément cliqué.

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

Notez que event.target Sera l'élément le plus profond cliqué sur. Ex: S'il y a un <span> Dans un <a>, Vous obtiendrez le <span>, Pas le <a>.

Si vous souhaitez attraper un clic, mais souhaitez extraire un élément spécifique (comme une classe), vous pouvez faire:

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

Sauf si un gestionnaire d'événements sur un élément le long du chemin fait une event.stopPropagation() ou return false, Vous aurez le clic ici.

17
Vincent Robert

Que diriez-vous de fixer simplement un clic sur le corps?

$('body').click(function(e){ ... })

Les e.target devrait contenir ce qui a été cliqué sur

4
Mottie

$('*').click( function() {...} ) Catch uniquement des clics sur des éléments existants lorsque vous avez appelé l'appel à .click(). Pour saisir des clics sur des éléments pouvant être créés plus tard, vous devrez vous attacher à body ou document comme d'autres ont suggéré.

4
jasongetsdown

Que diriez-vous:

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

Tout clic sera sur le corps, car c'est le parent de tous les nœuds visibles dans le DOM.

3
pkaeding