jQuery sur cliquez sur tout sauf un div et ses enfants

Je veux faire quelque chose quand je clique n’importe où, sauf quand je clique sur une div et ses enfants. C’est ce que j’ai essayé jusqu’à présent, mais cela ne fonctionne pas (cliquer sur ses enfants continue d’exécuter ce qui est entre parenthèses.

$('body').on('click', '* :not(#calculator)', function(e){

Je ne peux pas utiliser quelque chose comme ça:

jQuery – Sélectionnez tout sauf un seul élément et ses enfants?

 $("body > *").not("body > #elementtokeep").remove();

Parce que la fonction .not n’est pas quelque chose que je peux mettre à l’intérieur de la fonction .on() .

Comment puis-je atteindre cet objective?

Utilisez pas avec une virgule pour avoir les deux sélecteurs: l’élément lui-même et les éléments enfants

 jQuery(document.body).on("click", ":not(#calculator, #calculator *)", function(e){ console.log(this); e.stopPropagation(); });

jsFiddle

Vous pouvez vérifier à l’intérieur de la fonction pour l’élément en question:

 $('body').click( function(e){ if (!$(e.target).is("#calculator") || $("#calculator").has(e.target).length ) { // do your stuff } });

Je n’ai pas assez d’exigences pour append des félicitations, je dois donc poser ma question ici à @epascarello . Quand j’ai fait peu d’enfants, A et B sont toujours touchés. Je ne suis pas sûr d’avoir tort ou pas, mais je veux vraiment obtenir une solution.

 jQuery(document.body).on("click", ":not(#calculator, #calculator *)", function(e){ console.log(this); e.stopPropagation(); alert('test'); });

Démo en direct

Au lieu de

 $('body').on('click', '* :not(#calculator)', function(e){ });

Vous pouvez utiliser (cette version est préférable car elle est plus performante)

 $("body").on("click", ":not(#calculator, #calculator *)", function(e){ });

 $("body :not(#calculator, #calculator *)").on("click", function(e){ });