Evento e collegamenti YUI
-
05-07-2019 - |
Domanda
Usando YUI, ho un div, con un listener allegato che dice che se faccio clic sul div, eseguo una funzione di callback. All'interno del div è una serie di normali collegamenti html ad altre pagine. Quello che VOGLIO che accada è che se faccio clic su un collegamento, vado a quella pagina. Ma, se faccio clic in un punto qualsiasi del div all'esterno di un collegamento, esegue la funzione di richiamata.
Quello che sta VERAMENTE accadendo è che se faccio clic su un collegamento all'interno del div, esegue la funzione di callback per il div e quindi passa immediatamente alla pagina collegata.
So come impedire al mio clic nel div di gorgogliare fino al documento. Ma come posso prendere un normale link html precedente e impedire che il clic su di esso venga attivato dall'evento click per il div? Devo riformattare i collegamenti come collegamenti javascript con i loro callback e quindi interrompere la propagazione? Oppure, c'è un modo più semplice?
Amy
Soluzione
Seth ha avuto l'idea giusta, anche se è una buona idea essere un po 'più specifici nei tuoi controlli.
YAHOO.util.Event.on("container", "click", function(e) {
var tgt = YAHOO.util.Event.getTarget(e);
if(tgt.nodeName.toLowerCase() !== 'a') {
YAHOO.util.Event.preventDefault(e);
console.log("Not an anchor!"); //TODO: REMOVE DEBUG OUTPUT
}
});
Ho creato una pagina di esempio su http://tivac.com/yui2/amy_events.htm nel caso in cui tu voglia vederlo in azione.
Altri suggerimenti
È possibile controllare tagName
su event.target
in questo modo:
YAHOO.util.Event.addListener("container", "click", function(e) {
if (e.target.tagName == 'DIV') {
// do something magical!
}
});
Se alla fine si inserisce un div all'interno di un tag di ancoraggio, lo si romperà ovviamente.