0

The alleged rendering bug can be seen here:

http://jsfiddle.net/2FZhW/

<input id="box" type="checkbox">
<button id="chk">Check</button>
<button id="unchk">Uncheck</button>

function check() {
    $("#box").prop("checked", "checked");
}

function uncheck() {
    $("#box").removeProp("checked");
}

$("#chk").click(check);
$("#unchk").click(uncheck);

Affected browsers include: Chrome 27, Android Froyo, and my co-worker's iPhone (version?). Unaffected: IE9, FireFox 22

On the affected browsers, You can click the "Check" and "Uncheck" buttons each once, and after that they appear to stop working.

Despite appearances, the checkbox state appears to be set correctly set with each click. I used the Chrome debugger to reach this conclusion.

Newer versions of jQuery seem to have no effect on the outcome.

In case the answer is obvious, I did spend some time searching on SO and Google!

Thanks in advance.

4

1 回答 1

1

您想在 prop 中选中和取消选中 use boolean values,不要使用removeProp它,这可能最终会从您提到的某些浏览器中的元素中删除选中的属性,并可能导致此类问题。

function check() {
    $("#box").prop("checked", true);
}

function uncheck() {
    $("#box").prop("checked", false);
}

演示

文档

.removeProp() 方法删除由 .prop() 方法设置的属性。

对于 DOM 元素或窗口对象的某些内置属性,如果尝试删除该属性,浏览器可能会生成错误。jQuery 首先将值 undefined 分配给属性,并忽略浏览器生成的任何错误。通常,只需要删除已在对象上设置的自定义属性,而不需要删除内置(本机)属性。

注意:请勿使用此方法删除本机属性,例如选中、禁用或选中。这将完全删除该属性,并且一旦删除,就不能再次将其添加到元素中。使用 .prop() 将这些属性设置为 false。

于 2013-07-09T02:56:48.460 回答