¿Cómo detener la propagación de eventos cuando se usa delegate?

Question

Cuando uso .bind para vincular el evento en el elemento secundario y secundario, el evento secundario puede detener la propagación del evento con return false; Pero cuando uso delegate, devuelvo falso; no detiene la propagación de eventos.

http://jsfiddle.net/J3EAQ/

html:

<div class="parent"> 
    <div class="child"></div> 
    <div class="child"></div> 
</div> 

JS:

$('.parent').delegate('.child','click',function(e){ 
    alert('child click'); 
    return false; 
}); 
$('.parent').bind('click',function(e){ 
    alert('parent click'); 
}); 

Answer 1

e.stopPropagation() no funcionará en este caso. Use e.stopImmediatePropagation() en su lugar. Aquí hay un fiddle

Answer 2

Debería utilizar e.stopPropagation() para evitar la propagación, no devolviendo falsa.

return false es técnicamente dos cosas; 1) prevenir la acción predeterminada, y 2) detener la propagación. Intente cambiar a la invocación de método en e y vea si eso soluciona su problema.

Answer 3

¿Por qué dos manipuladores de clic cuando se puede tener uno:

$('.parent').click(function (e) { 
    if ($(e.target).is('.child')) { 
     alert('child click'); 
    } else { 
     alert('parent click'); 
    }  
}); 

Demostración en directo:http://jsfiddle.net/J3EAQ/2/

---

Una generalización de este patrón:

$(element).click(function (e) { 
    if (e.target === this) { 
     // this element was clicked directly 
    } else { 
     // this element was NOT clicked directly 
     // a descendant of this element was clicked 
    }  
}); 

---

¿Manejadores separados?

$('.parent').click(function (e) { 
    if (this ==== e.target) { 
     parentClicked.call(e.target, e); 
    } else { 
     childClicked.call(e.target, e); 
    }  
}); 

function childClicked(e) { 
    // child click handler 
} 

function parentClicked(e) { 
    // parent click handler 
} 

Answer 4

Se puede utilizar siempre e.stopPropagation()

Answer 5

su evento no está siendo propagado. está vinculando un controlador de clic al .parent y está haciendo clic en .parent

Answer 6

Lo que funcionó para mí fue verificar el nombre de clase del clic objetivo en el controlador de clic que no desea que se active por otro evento de clic. Algo como esto.

if(e.target.className.toString().indexOf("product-row") > -1){ 
     // Only do stuff if the correct element was clicked 
    }