jQuery $('html, body').not()

Question

aquí - Je veux que l'alerte se produise lorsque vous cliquez n'importe où, mais pas sur la division.

Lorsque je clique sur la division, les alertes s'affichent également.

JS

$("html, body").not('.entry-content').click(function() {            
    alert('d');                        
}); 

HTML

<div class="entry-content"> kkkk </div>

Answer 1

Vous pouvez utiliser l'argument de l'événement pour voir quelle cible a été cliquée et retourner false.

$("html, body").click(function(e) {
    if ($(e.target).hasClass('entry-content')) {
        return false;
    }
    alert('d');
});

http://jsfiddle.net/keyZw/

Vous utilisez le filtre .not() mais il fait toujours partie de votre html/body donc vous devez le gérer dans la fonction de clic. De plus, vous ne faites que lier l'événement de clic

Alors

 // find html,body - not ones with class=entry-content - bind click
 $("html, body").not('.entry-content')

Cela n'empêche donc pas l'alerte puisque votre div est toujours à l'intérieur du corps.

Comme mentionné vous devez seulement vous lier au corps vraiment

$("body").click(function(e) {
    if ($(e.target).hasClass('entry-content')) {
        return false;
    }
    alert('d');
});

Answer 2

$("html *").click(function(e) {
    if ( e.target.className.indexOf("entry-content") < 0 ) {
        alert('d');
    }
}); 

DEMO

---

Le code original ne fonctionne pas car le .not() s'applique aux sélecteurs situés devant lui - html y body . Aucun des deux n'a la classe de entry-content pour que l'événement se déclenche

Answer 3

Vous pouvez également arrêter la propagation sur l'élément cliqué

$("body").click(function() {
    alert();
});

$(".entry-content").click(function(e) {
    e.stopPropagation();
});

Fonctionne également en cliquant sur un sous-élément

<div class="entry-content">Element
  <span>Sub element</span>
</div>

Consultez le Violon

Answer 4

Le problème est que vous ajoutez l'événement de clic aux balises HTML et BODY. Donc, tout d'abord, vous allez recevoir 2 alertes lorsque vous cliquez dans la zone du corps. De plus, en raison de la façon dont les événements se propagent vers le haut, le fait de cliquer sur le DIV en question propagera l'événement de clic vers le corps et le html également. Vous devez donc effectuer une vérification à l'intérieur du gestionnaire de clic pour déterminer si vous souhaitez ou non afficher le message d'alerte.

J'ai modifié votre jsfiddle ci-dessous pour n'inclure que le HTML dans votre sélecteur, et pour vérifier la présence de la balise entry-content dans le gestionnaire.

http://jsfiddle.net/m2eqS/6/

$("html").click(function(e) {
    if(!$(e.target).hasClass("entry-content")){
      alert('TEST');
   }                        
}); 

La différence entre la liaison à HTML et à BODY est que si vous voulez pouvoir cliquer n'importe où sur la page, en dessous de la fin du contenu/corps, vous devez utiliser HTML. Sinon, utilisez BODY.