如何在不选择整行的情况下选择复选框（参见正文）？

Question

说，我有一个HTML：

<div class="row">
    <input type="checkbox">
</div>

1. 当用户点击整行时，它会突出显示（selected事件添加的onClick类）。我将onClick事件附加到类.row的元素。

2. 当用户点击复选框（位于.row内）时，此复选框将被选中。但不应突出显示行。

是否可以从.row事件的onClick区域中排除复选框的区域？

---

更新

以下是我现在的情况：http://jsfiddle.net/saAGU/

当我完全点击复选框时，我不希望切换课程。

---

更新2

以下是jQuery的工作解决方案，供将来使用：http://jsfiddle.net/saAGU/2/

Answer 1

是的，这是可能的。正确的方法是在复选框上放置一个onclick事件，捕获事件并停止传播。

这样的事情：

function checkboxClick (e) {
    e.stopPropagation();
}

请告诉我它是否有效

Answer 2

将click事件添加到每个复选框并停止其传播。这应该有效 -

复选框的事件处理程序中的

e.stopPropagation单击

http://jsfiddle.net/saAGU/3/

Answer 3

如果您捕获事件，并查看event.toElement，您可以看到他们是否点击了.row或其他内容。

http://jsfiddle.net/saAGU/1/

$('.row').click(function(event){
    if (event.toElement !== this) // Did the user click on the row directly?
        return;

    $(this).toggleClass('selected');
});