Attiva un evento per tutti gli ascoltatori tranne il trigger stesso: jquery, gestione degli eventi, modello di osservazione

Ho un paio di link legati a un evento personalizzato. L'evento viene attivato passando con il mouse su uno qualsiasi di questi collegamenti. Tuttavia, non voglio che venga attivato sul link che ho effettivamente sospeso.

Posso pensare ad un paio di possibili soluzioni

1. Ho messo un "se" nella funzione di callback per ilevento e in qualche modo verificare se l'oggetto di trigger è l'oggetto che tenta di eseguire la funzione di callback e gestire t di conseguenza. Gli oggetti possono essere confrontati in modo conveniente ed efficace?

2. Separare temporaneamente l'ascoltatore dell'oggettosparare l'evento e poi ricollegarlo in seguito. Questo non sembra a prova di proiettile poiché l'evento potrebbe essere rimbalzato prima che fosse effettivamente attivato? Non sono sicuro di come vengano gestiti questi tipi di code di eventi. Il jquery.trigger interesserà effettivamente tutti gli ascoltatori prima che venga eseguita la prossima istruzione? L'altro lato negativo è che potrebbe essere considerato un hack invece di buone pratiche? La tua opinione?

3. Salta tutta la faccenda dell'evento-bind-trigger e giustoraccogliere ogni oggetto in una matrice e lasciare che la funzione di callback al passaggio del mouse esegua l'iterazione facendo ciò che voglio. Immagino che in realtà qualcosa di simile a quello che sta realmente accadendo dietro le quinte negli scenari sopra

Esiste una pratica comune per risolvere questo problema? Qualcosa nel modello dell'osservatore, forse?

risposte:

Dare a ciascuno dei collegamenti un ID e una classe. Quando il mouse entra nell'area attiva di uno dei tuoi collegamenti speciali, attiva l'evento personalizzato su tutti loro con l'ID del link su cui si trova il mouse. Chiedi al tuo gestore di eventi personalizzato di verificare che l'ID non corrisponda all'ID dei link che ricevono la notifica dell'evento.

<a class="fancy-hover" id="1" href="foo">Example Link 1</a>
<a class="fancy-hover" id="2" href="bar">Example Link 2</a>
<a class="fancy-hover" id="3" href="qux">Example Link 3</a>

<script type="text/javascript">
// custom event
$("a.fancy-hover").bind("mouseOverOneOfUs",function(event, whatMouseHoversOver){

// Prevent item mouse is over from responding.
if (whatMouseHoversOver != this.id) {
// do something
}
return false; // Stop propagation up the DOM tree. Remove to allow propagation.
});

// When mouse enters the active area of a link with class "fancy-hover",
//     tell all links in the class which member of the class has the mouse.
$("a.fancy-hover").mouseenter(function() {

// this.id is ID of current element,
//     and we pass the value as an array to our custom event.
$("a.fancy-hover").trigger("mouseOverOneOfUs", [this.id]);
});
</script>