YUI evento y enlaces

Question

Usando YUI, tengo un div, con un oyente adjunto que dice que si hago clic en el div, ejecuto una función de devolución de llamada. Dentro de la div es una serie de enlaces html normales a otras páginas. Lo que QUIERO que suceda es que si hago clic en un enlace, voy a esa página. Pero, si hago clic en cualquier lugar del div fuera de un enlace, ejecuta la función de devolución de llamada.

Lo que REALMENTE está sucediendo es que si hago clic en un enlace dentro del div, ejecuta la función de devolución de llamada para el div y luego navega inmediatamente a la página vinculada.

Sé cómo mantener mi clic en el div divergente en el documento. Pero, ¿cómo tomo un enlace html antiguo regular y detengo el clic en el que dispara el evento click para el div? ¿Tengo que reformatear los enlaces como enlaces de javascript con sus propios callbacks y luego detener la propagación? O, ¿hay una manera más fácil?

Amy

Answer 1

Seth tiene la idea correcta, aunque es una buena idea ser un poco más específico en tus cheques.

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
    }
});

Construí una página de ejemplo en http://tivac.com/yui2/amy_events.htm en caso de que quieras verlo en acción.

Answer 2

Puede inspeccionar tagName en el event.target de este modo:

YAHOO.util.Event.addListener("container", "click", function(e) { 
  if (e.target.tagName == 'DIV') {
     // do something magical!
  }
}); 

Sin embargo, si terminas poniendo un div dentro de una etiqueta de anclaje, deberías romper esto obviamente.