problema con respecto a eventos en vivo

Question

Estaba leyendo http://api.jquery.com/event.stopPropagation/

Dado que el método .live() maneja eventos una vez que se han propagado a la parte superior del documento, no es posible detener la propagación de vida eventos

Estaba un poco confundido con esta afirmación, ¿Puede alguien explicarme lo mismo con un ejemplo?

Answer 1

El método Live vincula un controlador al documento e identifica qué elemento desencadenó el evento desde la propiedad event.target.

Por lo que el controlador real está en la parte superior (en términos de jerarquía).

El stopPropagation detiene el burbujeo de ir arriba en la jerarquía de DOM, pero desde el manejador es en la parte superior ya (en el caso .live) no hay lugar a la burbuja superior a ..

---

ejemplo intento ..

- document 
    - div 
    - link 

se enlaza un controlador de eventos click al enlace (con el bind o click método).

Cuando hace clic en el vínculo, se desencadena el controlador, pero además el evento click sube el DOM hasta que llega al documento y también activará los manejadores de clic vinculados al div y al documento. (menos que utilice la .stopPropagation)

Alternativamente, si se utiliza el método .live para enlazar el controlador de eventos, quedará vinculado al documento. Si ahora hace clic en el enlace, el evento (que no se activará de inmediato, ya que ningún controlador está vinculado a él) subirá naturalmente el DOM (activando los manejadores de clics que encuentra). Una vez que alcanza el documento activará nuestro propio controlador. Pero no hay superior para ir, por lo que el stopPropagation es inútil en este momento.

Answer 2

HTML:

<div id="outer"> 
    <div id="inner"> 
     <span>.live() version</span> 
    </div> 
</div> 

<div id="outer2"> 
    <div id="inner2"> 
     <span>.delegate() version</span> 
    </div> 
</div> 

JS:

$(function(){ 

    $('#inner2').delegate('span', 'click', function(e){ 
     e.stopPropagation(); // indeed, no alert! 
    }); 

    $('span').live('click', function(e){ 
     e.stopPropagation(); 
     // we would expect the propagation to stop here, so no alert, right? 
    }); 

    $('#outer2, #outer').click(function(){ alert("Don't reach me!"); }); 

}); 

Ejemplo: http://jsfiddle.net/knr3v/2/

.live() sólo hace su magia una vez que el evento ya ha burbujeado, por lo que detener el evento de propagación es inútil - es demasiado tarde, ya alcanzó la parte superior del árbol y se propagó ...