Comment exécuter une fonction sur un événement sur n'importe quel élément sauf un avec jQuery?

Question

Je veux exécuter une fonction sur un événement sur n'importe quel élément sauf un :

$(":not('#myelement')").bind('mousedown', function() {
    console.log('événement mousedown');
});

mais lorsque je clique sur #myelement, la fonction est exécutée quand même, car le sélecteur sélectionne tous les parents. De plus, la fonction est exécutée pour chaque parent. Comment puis-je : -exécuter la fonction une seule fois ? -ne pas exécuter la fonction sur mon élément?

Voici la question complète :

$("#current_page a").toggle(
    function(){
        $("#current_menu").hide();                    
        return false;
    },
    function(){
        $("#current_menu").show();
        return false;
    }
);

$(":not(#current_page a)").bind('mousedown',function() {               
    $("#current_menu").hide();
});

Lorsque je clique sur "#current_page a", l'événement mousedown est déclenché, et je ne veux pas cela.

merci jul

Answer 1

Supprimez vos guillemets dans '#myelement'... Juste :not(#myelement). Vous devriez être bon.

Édition : Ajoutez une vérification dans l'événement en vérifiant l'événement cible pour corriger un éventuel problème de propagation :

function eventFunc(event) { 
    if ($(event.target).attr("id") !== 'myelement') {
        // faire le travail
    }
}

Answer 2

Deux options:

1. Vous pourriez faire en sorte que le gestionnaire vérifie la cible de l'événement et s'arrête s'il s'agit du mauvais élément :

    $(':not(#foo)').mousedown(function(ev) {
      if ($(ev.target).is('#foo')) return false;
      // autre chose
    });

2. Vous pourriez ajouter un gestionnaire spécialement pour l'élément indésirable et lui faire annuler l'événement :

   $(':not(#foo)').mousedown(...);
   $('#foo').mousedown(function() { return false; });

Answer 3

Voici un exemple complet qui devrait faire ce que vous demandez...

$(":not(#myelement)").bind('mousedown', function(event) {
    console.log('événement de mousedown');
    event.stopPropagation()
});

Note importante (basée sur le commentaire de Jul)

L'événement sera ajouté à CHAQUE élément de la page, à l'exception de l'élément ayant un identifiant "myelement". J'ai créé cette démo rapide pour illustrer...

Vous remarquerez que l'alert("hi") ne sera jamais appelé, peu importe où vous cliquez - cela démontre l'arrêt de la propagation de l'événement. Vous remarquerez également que lorsque vous cliquez sur "myelement", l'événement du parent est appelé - car vous n'avez pas ajouté le gestionnaire d'événement à cet élément. Je vais expliquer ci-dessous comment vous pouvez corriger cela. Voici l'exemple.

    Un
    Un
    Un
    Un
    Un
    Pas Un
    Un
    Un

    $(":not(#myelement)").bind('mousedown', function(event) {
        alert($(this).attr("id"));
        event.stopPropagation()
    });

Et vous devrez faire ce qui suit pour empêcher les clics sur "myelement" de déclencher l'élément parent :

$(":not(#myelement)").bind('mousedown', function(event) {
    console.log('événement de mousedown');
    // event.stopPropagation() - vous ne voulez peut-être plus cela - à vous de voir...
    // Je pense que vous vouliez ignorer les clics sur "myelement", plutôt que 
    // d'empêcher la propagation de l'événement
});
$("#myelement").bind('mousedown', function(event) {
    event.stopPropagation()
});