Question

我在表TR TD中有一个输入复选框。我抓住TR上的点击来做stuff_1，但如果我点击复选框，我想做stuff_2（而不是stuff_1）：

HTML：

<table>
<TR class="tr">
<TD><INPUT TYPE="CHECKBOX" class="checkbox"></TD>
<TD> Click me 1 to expand</TD>
</TR>

<TR class="tr">
<TD><INPUT TYPE="CHECKBOX" class="checkbox"></TD>
<TD> Click me 2 to expand</TD>
</TR>
</table>

JQUERY：

$(".tr").click(function(){
  //Here I would like to do STUFF_1

});

$(".checkbox").change(function() {
  //Here I would like to do STUFF_2

});

但是每次点击复选框都会出现STUFF_1 .... 我该如何解决这个问题？

Answer 1

你可以这样做：

$(".checkbox").click(function(e) {
   e.stopPropagation();
   // do your stuff
});

Demonstration

Answer 2

尝试以下方法：

$(".tr").click(function(e){
  if(e.target.nodeName == "INPUT") return false;
  // do stuff 1     
});

$(".checkbox").change(function() {
    // do stuff 2    
});

在TR表中测试复选框

2 个答案: