Prevenire Bambino di sparare evento click del genitore

Question

Si consideri il seguente frammento di codice:

<div class="div-outer"> 
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. 
    <div class="div-inner" style="background:red"> 
     Curabitur hendrerit vehicula erat, ut gravida orci luctus vitae. 
    </div> 
</div> 

Ora supponiamo che il div esterno ha un live click ad esso associati. Come faccio ad assicurarmi che il live click non venga attivato quando I click in qualsiasi punto dello div interno?

Edit:

Ecco il JS come richiesto

$(".div-outer").live("click",function(){alert("hi")}); 

Questo non dovrebbe essere triggereed quando si clicca su ".inner-div"

Answer 1

È necessario aggiungere un listener di eventi per l'interno bambino e annulla la propagazione dell'evento.

In parole povere JS qualcosa come

document.getElementById('inner').addEventListner('click',function (e){ 
    e.stopPropagation(); 
}); 

è sufficiente. Si noti che jQuery provides the same facility:

$(".inner-div").click(function(event){ 
    event.stopPropagation(); 
}); 

o

$(".inner-inner").on('click',function(event){ 
    event.stopPropagation(); 
}); 

Answer 2

si può fare questo da aggiungere un evento click sul div interno e utilizzare uno return false; o event.stopPropagation();

$(".div-inner").click(function(){ 

    return false; 
}) 

o

$(".div-inner").click(function(event){ 

    event.stopPropagation(); 
}) 

Answer 3

Crea nuova click listener per l'div interno e chiamare il event.stopPropagation() in questo nuovo evento.

come

$('div-outer').on('click','div-inner',function(e){ 
    e.stopPropagation(); 
}); 

Answer 4

uso stopPropagation nei vostri js file di

$(".eventclick").click(function(e) { 
    e.stopPropagation(); 
});