如何选择复选框而不选择整行(参见正文)

How to select check box without selecting the whole row (see body)?

本文关键字：选择 正文 复选框 何选择      更新时间：2023-09-26

比如说，我有一个html:

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

  1. 当用户单击整行时，它变得高亮显示(onClick事件添加的selected类)。我将onClick事件附加到.row类元素

  2. 当用户点击复选框(这是在.row)，这个复选框被选中。

是否有可能从onClick事件的.row区域中排除复选框的区域?

更新

下面是我现在的内容:http://jsfiddle.net/saAGU/

我不希望当我点击复选框时，类被切换。

更新2

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

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

像这样:

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

请告诉我它是否有效

为每个复选框添加click事件并停止其传播，这应该可以工作-

e.stopPropagation在事件处理程序中的复选框单击

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

如果您捕获事件，并查看事件。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');
});
相关文章：