Separazione di un listener jQuery da un sottoinsieme di elementi

Question

Utilizzo le descrizioni comandi di Zurb Foundation (http://foundation.zurb.com/docs/components/tooltips.html). Mi piacerebbe personalizzare leggermente il loro comportamento. Fanno uso di un listener di eventi mouseover sull'elemento source per creare il tooltip (alla prima chiamata) e quindi dissolverlo. Quello che sto tentando di fare è jQuery selezionare un sottoinsieme delle fonti del tooltip sulla pagina, rimuovi solo i loro ascoltatori di mouseover e associa quelli nuovi che lasceranno che il tooltip rimanga lì per un secondo prima di scomparire dopo che il mouse è stato spostato.

Ecco la parte difficile. ZURB lega il suo ascoltatore in quanto tale:

$('body.off-canvas').on('mouseenter', '.has-tooltip', ...);

Di seguito vi rimuovere con successo questo listener, come previsto:

$('body.off-canvas').off('mouseenter', '.has-tooltip');

ma ho solo voglia di rimuovere il listener per taluni di questi elementi, in questo modo:

$('body.off-canvas').off('mouseenter', '.has-tooltip.my-custom-class');

E tur out jQuery non lo riconoscerà come "sottrattivo" del set più grande di .has-tooltip elementi, essenzialmente dicendo "Non c'è nessun listener di eventi che corrisponde a questo selettore esatto, quindi non farò nulla". Qualcuno ha una buona soluzione? Ho trovato alcuni che funzioneranno se stai creando l'ascoltatore originale da solo, ma non è questo il caso.

Answer 1

Penso che sia possibile interrompere l'evento che bolle su quei collegamenti di ancoraggio se si desidera impedire che la funzione "mouseenter" applicata all'elemento del corpo venga attivata.

utilizzando jQuery:

$(".has-tooltip.my-custom-class").on("mouseenter", function(event){ 
    event.stopPropagation(); 
    .... 
    .... 
}); 

Speranza che aiuta.

Answer 2

Ho risolto questo approccio adottando un approccio diverso. Avevo pensato di non poter rimuovere gli eventi predefiniti di Foundation per tutte le normali tooltip perché avevo bisogno che Foundation continuasse a creare gli elementi tooltip. La soluzione alternativa era complicata, ma ha svolto il lavoro.

ho attivato manualmente l'evento mouseenter su tutte dei tooltip non appena la pagina di caricamento, utilizzando una classe speciale CSS per costringerli a rimanere invisibili dopo essere stato inizializzato invece di dissolvenza. Ho dovuto per simulare i dati del mouse nel caso in cui la Fondazione dipenda da questo per posizionare inizialmente i tooltip. Una volta apportate le modifiche al DOM, potrei aggiungere agli ascoltatori i normali tooltip che simulano il comportamento predefinito aggiungendo listener personalizzati ai miei elementi personalizzati.

// simulate and trigger default tooltip hover event to allow Foundation to create spans 
$('body.off-canvas .has-tip').each(function(){ 
    var event = $.Event('mouseenter'); 

    var offset = $(this).offset(); 
    var position = $(this).position(); 

    event.clientX = offset.left; 
    event.clientY = offset.top; 
    //event.offsetX = ; 
    //event.offsetY = ; 
    event.pageX = offset.left; 
    event.pageY = offset.top; 
    event.screenX = offset.left; 
    //event.screenY = ; 
    $(this).trigger(event); 
}); 
$('body.off-canvas .has-tip').trigger('mouseleave'); 

// remove default events 
$('body.off-canvas').off('mouseenter', '.has-tip'); 
$('body.off-canvas').off('mouseleave', '.has-tip'); 

// restore normal tooltips to normal behavior 
$('body.off-canvas').on('mouseenter', '.has-tip:not(.has-details)', function(){ 
    $('span.tooltip[data-selector="' + $(this).data('selector') + '"]').removeClass('force-visibility-hidden').fadeIn(); 
}); 
$('body.off-canvas').on('mouseleave', '.has-tip:not(.has-details)', function(){ 
    $('span.tooltip[data-selector="' + $(this).data('selector') + '"]').fadeOut(); 
}); 

// set up custom details tooltip listener 
$('body.off-canvas').on('mouseenter', '.has-tip.has-details', function(e){ 
    ... 
}); 

Come nota a margine, ho avuto anche per avvolgere il tutto in un setTimeout(..., 200); per assicurare che avrebbe eseguito dopo erano stati applicati gli ascoltatori della Fondazione.

Tutto sommato, questo è uno dei pezzi di codice più contorto che abbia mai scritto, ma funziona come un fascino.