忽略复选框单击？
忽略复选框单击？
提问于 2013-01-28 11:23:44
我有一个表，其中第一个单元格中的每一行都有一个<input type="checkbox" />。
我在<tr>上设置了一个点击处理程序，它可以切换复选框。
这是完美的，除非我单击实际的复选框，这会导致复选框具有与其预期相反的状态，因为它被切换了两次，一次是通过它的默认行为，一次是通过<tr>事件处理程序。
我想要做的基本上是忽略复选框点击，而只是对tr上的点击做出响应。
下面是我的tr事件处理程序
$('.files-table tbody').on('click', 'tr', function (e) {
var check = $('.check', this);
check.prop('checked', !check.prop('checked'));
check.prop('checked') ? selected++ : selected--;
numSelected.html(selected + ' item' + (selected === 1 ? ' ' : 's ' ) + 'selected: ');
if (selected == 1) {
withSelected.addClass('in').removeClass('hide');
noSelected.removeClass('in').addClass('hide');
} else if (selected == 0) {
withSelected.removeClass('in').addClass('hide');
noSelected.addClass('in').removeClass('hide');
}
if (check.prop('checked')) {
selectedItems[check.data('type')].push(check.data('id')+"");
} else {
selectedItems[check.data('type')].splice(check.data('id')+"");
}
console.log(selectedItems);
$(this).toggleClass('info');
});下面是一个示例行：
<tr>
<td style="width:15px;">
<input class="check" type="checkbox" data-id="6" data-type="directories">
</td>
<td>
<a href="/files/browse/1. First/1.1 First Child of First/6"
class="needs-tooltip"
title="Browse Directory">
<i class="icon icon-folder-close"></i>
</a>
1.1 First Child of First
</td>
<td>Directory</td>
<td>0 Items</td>
<td>27 Jan 2013</td>
<td>--</td>
<td>--</td>
</tr>Stack Overflow用户
发布于 2013-01-28 11:25:39
防止将您的事件传播给家长：
$(".check").on('click', function (e) {
e.stopPropagation();
});这将允许复选框的正常行为(切换选中状态)继续，但您的单击事件不会到达父级再次单击。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/14555014
复制相关文章
相似问题
腾讯云开发者
