jQuery,Chrome和Checkboxes。 奇怪的行为

我环顾了一下网站,似乎找不到这个问题的答案。 如果它确实存在,请随意指导我说的问题。

我目前正在尝试做一些基于树的复选框操作,而且我遇到了一些我觉得很奇怪的行为。

在谷歌浏览器中,我发现选中一个复选框会留下一些“残留”,如果你愿意的话,这将不允许我使用“attrRemove(’checked’)”检查或取消选中该复选框;“

有趣的是,Internet Explorer(9)有我想要的结果。 请在Chrome和IE中查看此jsFiddle,以便对效果进行比较。

http://jsfiddle.net/xixionia/9K5ft/

任何人都可以解释这些差异,以及我如何能够检查/取消选中已经“手动”检查的chrome中的复选框?

HTML

     

JavaScript的

 $(':checkbox').click(function(e) { if($(this).is(':checked')) { $(':checkbox').attr('checked', 'checked'); } else { $(':checkbox').removeAttr('checked'); } }); 

在此先感谢您的帮助。 🙂

编辑:

我能够找到这个工作。 如果其他人有任何其他解决方案,请告诉我,我会将其标记为解决方案。 🙂

 $(':checkbox').click(function(e) { var value = this.checked; $(':checkbox').each(function(){ this.checked = value; }); }); 

编辑:

事实certificate,这个问题是jQuery 1.6特有的。 以前版本的jQuery不会遇到这个问题。 但是,我在这里发布了一个解决方案: 使用jQuery为复选框设置“checked”?

来自: http : //api.jquery.com/prop/你应该使用prop而不是attr

然而,要记住关于checked属性的最重要的概念是它与checked属性不对应。 该属性实际上对应于defaultChecked属性,应仅用于设置复选框的初始值。 checked属性值不会随复选框的状态而改变,而checked属性则会改变。

使用复选框时(特别是复选框上的复杂逻辑)我总是试图避免复选框上的jQuery事件处理程序。 在点击复选框和使用的浏览器时,jQuery中存在与事件触发顺序有关的错误:您可以在此处找到问题部分的描述。 报价:

似乎当您在复选框上触发click事件时,默认行为(切换checked属性)将在事件处理程序触发后发生。 这与浏览器自然处理复选框单击事件时发生的情况相反 – 切换了checked属性,然后执行事件处理程序。 固有点击和jQuery事件触发之间的操作顺序的这种差异可能会导致一个大问题,如果事件处理程序依赖于复选框的状态(如果你在一个复选框上有一个点击处理程序,那么它意味着它可能会)。

jQuery称这是一个function,因为它从一开始就存在并将其更改为正确的行为只会杀死如此多的现有应用程序。 我经常遇到复选框和“已检查”的问题,因为事件被解雇太晚了。 所以我只使用本机JS方式:input.checked。

而不是这个:

 $(':checkbox').removeAttr('checked'); 

你应该做这个:

 $(':checkbox').attr('checked', false); 

干杯

我遇到了同样的问题,并使用chrome中的以下代码解决了。 希望它会有所帮助。

 $("#allchkbox").click(function() { if(this.checked) { $(".ItemChkbox").each(function() { this.checked = true; }); } else { $(".ItemChkbox").each(function() { this.checked = false; }); } });