jquery - 单击父级时的jQuery切换复选框

我编写了一个简单的js函数来打开/关闭复选框，然后单击父项（在本例中是TD）。当您单击TD上的任意位置时，此功能将按预期工作。
但是，当您单击复选框本身时，不会发生任何事情。
我想知道的是，它为什么会这样做，最好的解决方法是什么？
I have a provided a jsfiddle to demo this.
下面是我的js函数：

$("td.onoff").click(function() {
    var objCheckbox = $(this).find("input[type=checkbox]");
    if( objCheckbox.length >= 1 ) {
        objCheckbox.prop("checked", !objCheckbox.prop("checked"));
    }
});

谢谢。

最佳答案

你需要by pass event code when source of event is not td with class onoff，你可以这样做。
Live Demo

$(function() {
    $("td.onoff").click(function(event) {
        if(event.target.className != 'onoff') return;
        var objCheckbox = $(this).find("input[type=checkbox]");
        if( objCheckbox.length >= 1 ) {
            objCheckbox.prop("checked", !objCheckbox.prop("checked"));
        }
    });
});

​