Jquery .click事件

Question

我试图这样做，当他们点击<tr>时，它会打开一个工作正常的对话框。但是在这个<tr>中我有一个输入复选框，我需要允许他们点击而不打开对话框。这怎么可能？

$('#messageContainer tr').click(function () {
    var masterMessageID = $(this).attr('messageID');
    var replyToID = $(this).attr('replyToID');

    buildDialog(this.id, masterMessageID, replyToID);
    $(this).removeClass('messageNew');
});

HTML：

<tr replytoid="3" messageid="7078" id="16">
    <td>&nbsp;&nbsp;<input type="checkbox" name="checkAll"></td>
    <td>John Doe</td>
    <td>sdfsdf</td>
    <td>3/14/2012 1:29:47 PM</td>
</tr>

Answer 1

停止点击的传播：

$('#messageContainer tr :checkbox').click(function(e){
  e.stopPropagation();
});

Answer 2

您可以添加以下代码：

$('#messageContainer tr input:checkbox').click(function (e) {
    e.stopPropagation();
});

这将阻止复选框上的点击传播到tr。

示例 - http://jsfiddle.net/U5LBR/1/

Answer 3

修改：已更改.is(':checkbox')以检查e.target.type

DEMO

$('#messageContainer tr').click(function (e) {
    if (e.target.type && e.target.type == 'checkbox') {
       e.stopPropagation(); //stop bubbling
       return;
    }

    var masterMessageID = $(this).attr('messageID');
    var replyToID = $(this).attr('replyToID');

    buildDialog(this.id, masterMessageID, replyToID);
    $(this).removeClass('messageNew');
});

Answer 4

检查

在复选框中添加event.stopPropagation（）。它会阻止事件的冒泡。

$('#messageContainer tr').click(function () {
$('#popup').toggle();
});

$('#messageContainer input[type="checkbox"]').click(function(e){
alert('Checked');
 e.stopPropagation();

})

http://jsfiddle.net/JLDzq/1/