如何防止默认复选框事件覆盖jQuery check/uncheck函数？

我在一个表中有一个复选框列表，其中有一个简单的jQuery函数，允许用户单击表行中的任意位置以选中/取消选中复选框。它工作得很好，除非用户实际单击复选框。那就不行了。有什么想法吗？这是我的密码：

HTML:

---

如果HTML没有显示该函数是由什么触发的，那就很难说了。jsFiddle会很有帮助。这只是猜测，但可能是您单击复选框，复选框会选中它，但单击事件会立即调用取消选中该复选框的函数？

您可以使用它来避免您的

输入#myContacts

的单击事件传播到

tr

的单击事件。此外，我不敢相信您竟然以这种方式混合使用jQuery和DOM，而您应该使用jQuery事件

$(document).ready(function(){
  $("input#myContacts").click(function(e){
    e.stopPropagation();
  });
});

。。。
$（文档）.ready（函数（）{
$（'tr.checkBox'）.live（'click'，函数（e）{
如果（e.target.type！=='checkbox'）{
$（'input#myContacts'）.attr（“选中”，函数（）{
return！$（this.prop（'checked'）；
});
//或
$（this）.find（'input#myContacts'）.attr（“checked”，函数（）{
return！$（this.prop（'checked'）；
});
}
});
});

解决方案1：（使用两个表格单元格，但仅绑定单击文本单元格）

解决方案2：（在复选框单击事件上使用stopPropagation（））

---

两者都使用jQuery将事件绑定到首选元素。

我刚刚更新了代码，以显示如何从html中调用函数。您仍然没有向我展示最重要的内容；您的复选框是否在。我相信是的，这是你的问题。看看这里，看看我是否有正确的想法：。如果我这样做了，这正是我上面建议的，它正在滴答作响，然后（由于您的脚本）在您看到它改变之前取消滴答。您正在寻找的修复方法是将该单击事件绑定到包含复选框的旁边的标签，或者停止冒泡到的单击事件。要防止冒泡：字符已用完。。。我会尝试提出一些解决方案，但我要和某人见面一天，所以我现在没有时间。也许当我今晚（英国时间）回来时，如果你仍然没有解决方案，我可以试一试。而且（奇怪的是）当js在JSFIDLE上的js框中时，我无法让你的代码工作。这可能是因为您没有使用$（选择器）。单击（函数）绑定，这是使用jquery时将事件绑定到html元素的常用方式。请参见此处：

#myContacts

复选框在哪里？详细张贴html@John安德森：亚历山大说得有道理；这里有多个有效的解决方案。如果您需要进一步澄清，请询问，否则接受回答。另一种解决方案（使用较少的脚本）是仅在单击标签时启动脚本，而不是在包含复选框的整行中启动脚本。非常感谢您的帮助！我是jQuery的新手。

function checkBox() {

var ischecked = $('input#myContacts').attr("checked");

if(ischecked)
{
    $('input#myContacts').attr("checked", false);
}
else
{
    $('input#myContacts').attr("checked", true);
}

return false;
}

$(document).ready(function(){
  $("input#myContacts").click(function(e){
    e.stopPropagation();
  });
});

   <tr class="checkBox">...</tr>


    $(document).ready(function () {
        $('tr.checkBox').live('click', function (e) {
            if (e.target.type !== 'checkbox') {
                $('input#myContacts').attr("checked", function () {
                    return !$(this).prop('checked');
                });

                //Or

                $(this).find('input#myContacts').attr("checked", function () {
                    return !$(this).prop('checked');
                });
            }
        });
    });