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

È stato utile?

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.

Autorizzato sotto: CC-BY-SA insieme a attribuzione
Non affiliato a StackOverflow
scroll top