Empêche le déclenchement d'un clic lorsque l'élément est cliqué, y compris tous les éléments enfants

Question

J'ai un script qui ouvre et ferme un élément fixe. Il y a une superposition sur fond noir (comme Facebook en cliquant sur la vidéo) et quand l'utilisateur clique n'importe où sur le noir, la superposition sera fermée. Mais, si l'utilisateur clique sur le conteneur interne, ou l'un des éléments devrait rester ouvert.

Mon script ferme le conteneur interne si je clique sur des enfants. Comment éviter cela?

docu = $(document), 
quot = $('.quote'), 
quot_over = $('.quote_overlay'), 
quot_cont = $('.quote_container'); 

quot.click(function(event) { 
    quot_over.toggle(1, function() { 
     docu.click(function(event) { 
      var target = $(event.target); 

      if(!target.is(quot_cont)) { 
       quot_over.hide(); 

       docu.unbind('click'); 
      } 
     }); 
    }); 
}); 

Answer 1

Je ne sais pas pourquoi vous avez cette ligne là-bas:

quot_over.toggle(1, function()

Mais qui ferme immédiatement avant d'évaluer où le clic a été, de sorte que vous devez supprimer cela.

Deuxièmement, vous vérifiez seulement si le clic est sur quote_container, et ne vérifie pas s'il est sur l'un des enfants de quote_container.

travail jsFiddle: http://jsfiddle.net/dsnosw5p/4/