javascript - jQuery 点击 td 切换复选框

Question

正如标题所暗示的那样，我希望能够通过点击表格或复选框本身来打开或关闭复选框。单击 td 时，下面的解决方案有效，但由于某种原因，当您单击复选框时没有任何反应。关于这里发生的事情有什么想法吗？

$('td').click(function (e) {
    // Toggle checkbox
    $('input:checkbox', this).prop('checked', function (i, value) {
        return !value;
    });
});

谢谢!

http://jsfiddle.net/Littlebob/56CnR/

Answer 1

这是因为 <input>复选框在 <td> 内并且您已将点击事件附加到 <td>

为了克服这个问题，检查目标类型，如果不是输入复选框，则需要对其进行处理。

DEMO

$('td').click(function (event) {
    if (!$(event.target).is('input')) {
       $('input:checkbox', this).prop('checked', function (i, value) {
        return !value;
       });
    }
});

引用

event.target

jQuery.is()