Comment puis-je utiliser jQuery pour déterminer si un événement click se déclenche dans un élément spécifique?

Question

J'utilise le code suivant pour animer un bloc. Dans mon code, div_animate() masque essentiellement un <div> avec le sélecteur spécifié s'il est actuellement visible.

$(document).click(function(event){ 
    div_animate("#container"); 
}); 

Je dois déterminer si l'utilisateur a cliqué sur un enfant de #container et si oui, return false; - pour autant que je peux dire, le code pour cela ressemblerait à quelque chose comme ceci:

$(document).click(function(event){ 
    if (/* the event's target has a parent of #container */) { 
     return false; 
    } else { 
     div_animate("#container"); 
    } 
}); 

Des pensées?

Answer 1

La chose serait plus simple:

if ($(event.target).is('#container *, #container')) // edited - thanks @gnarf 
    // is a child 
else 
    // is not a child 

Il y a des choix différents que vous pouvez faire pour détecter que ce soit un enfant du conteneur cible (ou non-cible); c'est juste un. Une alternative:

if ($(event.target).closest('#container').length) 

Answer 2

Vous pouvez empêcher l'action si le clic origine ou dans #container, comme ceci:

$(document).click(function(event){ 
    var c = $("#container")[0]; 
    if (event.target == c || $.contains(c, event.target)) { 
     return false; 
    } else { 
     div_animate("#container"); 
    } 
}); 

Le premier chèque est si elle venait de se #container, le second est si est venu d'un enfant, que #container$.contains(). Une façon tout à fait autre, plus simple est d'empêcher que la bulle jusqu'à document en cliquant sur #container, comme ceci:

$("#container").click(function(e) { 
    e.stopPropagation(); 
}); 
$(document).click(function() { 
    div_animate("#container"); 
});