2010-08-11 12 views
8

mi hanno struttura come questajquery - disabilitando la funzione click sul elemento padre

<table><tr><td></td><td><input type="button" name="button"></td></tr></table> 
<script> 
$('tr').click(function(){window.alert('tr');}) 
$(':input').click(function(){window.alert('input');}) 
</script> 

quando clicco sul pulsante, tr clicca evento chiamato anche. c'è un modo per disabilitare l'evento click sull'elemento genitore? l'unica soluzione che ho trovato è quella di aggiungere una classe all'elemento genitore e all'interno della sua funzione di controllo per controllarla. per esempio:

<script> 
$('tr').click(function(){ if(!$(this).hasClass('disable')) { window.alert('tr'); } $(this).removeClass('disable'); }) 
$(':input').click(function(){window.alert('input'); $(this).closest('tr').addClass('disable');}) 
</script> 
+0

ho avuto lo stesso identico problema ed è la soluzione è sorprendentemente difficile da trovare. Grazie mille per aver posto questa domanda e tutti i rispondenti per il loro contributo. – MOnsDaR

risposta

14

uso .stopPropagation()

$('tr').click(function(){ 
    window.alert('tr'); 
}); 
$(':input').click(function(e){ 
    e.stopPropagation(); 
    window.alert('input'); 
}); 

demo

+0

sembrava come se fosse troppo facile, ma funziona come un fascino. –

+0

+1, vedere il commento sulla domanda – MOnsDaR

3

.stopPropagation() funzionerebbe ma se non si desidera interrompere l'intero evento, è possibile attivarlo solo se i target corrispondono.

See this thread.

Problemi correlati