jQuery的 - 父元素

Question

上禁用点击功能我有结构这样

<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> 

当我点击按钮，点击TR事件也被称为。有没有什么办法可以禁用父元素的点击事件？我发现的唯一解决方案是将类添加到父元素，并在其单击函数中检查它。 例如：

<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> 

Answer 1

使用.stopPropagation()

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

demo

Answer 2

停止传播？

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

这将防止click事件通过其父母冒泡。

Answer 3

.stopPropagation（）可以工作，但如果您不想停止整个事件，那么只要目标匹配就可以触发它。

See this thread。

Answer 4

也可以使用event.stopimmediatepropagation()和event.isImmediatePropagationStopped()

$(':input').click(function(e){ 
    e.stopImmediatePropagation(); 
    var status = e.isImmediatePropagationStopped(); 

    //CHECK 
    console.log(status); //true-false 
});