jQuery event bubbling: comment capturer un clic imbriqué?

Question

Je suis la capture d'un clic sur un LI donné:

<ul> 
    <li class="opt">Text 1</li> 
    <li class="opt">Text 2</li> 
</ul> 

Avec le code:

$('.opt').live('click', function(event) { 
    console.log("Click!"); 
} 

et il fonctionne à merveille :) Cependant, je dois aussi soutenir la capacité de bloc imbriqué éléments à exister à l'intérieur du LI, sans changer mon code javascript. Le javascript ci-dessus ne pas feu lorsque le texte 1 clic dans ce cas:

<ul> 
    <li class="opt"> 
     <div> 
      <div> 
       <span>Text 1</span> 
      </div> 
     </div> 
    </li> 
</ul> 

J'ai lu que les événements jQuery « bulle up » dans les DOM, mais malheureusement pas de bouillonnement se produit ici. Quel est le moyen le plus propre de capturer un événement click dans un LI quand je ne suis pas sûr de ce que d'autres éléments pourraient contenir?

Answer 1

Vous avez besoin d'un point sur ce sélecteur de classe, alors il devrait fonctionner:

$('.opt').live('click', function(event) { 
    console.log("Click!"); 
} 

À moins que vous faites quelque chose d'anormal (par exemple .stopPropogation() sur un enfant cliquée), l'événement devrait bouillonner jusqu'à tout seul .

Answer 2

$('.opt, .opt *').live('click', function(event) { 
    console.log("Click!"); 
}