jquery - 代码在 jQuery 2.1.4 中失败，但在旧版本中运行良好

Question

我注意到我的代码在 jQuery 2.1.4 中不起作用。但适用于 jquery 1.4.3。我编写了一个代码，通过它检查主复选框会检查表中的所有复选框。该代码适用于前 2 次单击，但不适用于第 3 次单击。当我使用 jquery 1.4.3 时，代码可以正常工作。jquery 代码是 -

<script type="text/javascript">
    $(document).ready(function () {
        $("#mainCheckBox").click(function () {
            if ($(this).is(":checked")) {
                $("#pageTbody").find('input[type="checkbox"]').each(function () {
                    $(this).attr("checked", true);
                });
            }
            else {
                $("#pageTbody").find('input[type="checkbox"]').each(function () {
                    $(this).attr("checked", false);
                });
            }
        });
    });
</script>

有人可以给出为什么它在最新的 jquery 版本上失败的解决方案吗？

Answer 1

您需要使用.prop()而不是 .attr()

As of jQuery 1.6, the .prop() method provides a way to explicitly retrieve property values, while .attr() retrieves attributes.

$(this).prop("checked", true/false);

现有代码可以优化为

$(document).ready(function () {
    $("#mainCheckBox").change(function () {
        $("#pageTbody input[type='checkbox']").prop("checked", this.checked);
    });
});

1. 无需使用.each()
2. 使用change事件而不是click