全选时不显示 HTML 复选框答案

【问题标题】：HTML checkbox when select all tick doesn't show全选时不显示 HTML 复选框
【发布时间】：2013-08-31 16:00:49
【问题描述】：

<table class="list" id="example">
    <thead>
        <tr>
            <td class="first" width="1" style="text-align: center;"><input type="checkbox" onclick="$('input[name*=\'selected\']').attr('checked', this.checked);"></td>
            <td class="left">
                Username
            </td>
            <td class="left">
                Status
            </td>
            <td class="left">
                Date Added
            </td>
            <td class="right">
                Action
            </td>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td style="text-align: center;"><input type="checkbox" name="selected[]" value="2">
            </td>
            <td class="left">testing</td>
            <td class="left">Enabled</td>
            <td class="left">31/08/2013</td>
            <td class="right"> [ <a href="">Edit</a> ]</td>
        </tr>
        <tr>
            <td style="text-align: center;"><input type="checkbox" name="selected[]" value="1">
            </td>
            <td class="left">admin</td>
            <td class="left">Enabled</td>
            <td class="left">31/03/2013</td>
            <td class="right">[ <a href="">Edit</a> ]</td>
        </tr>
    </tbody>
</table>

我有一个复选框，单击时会选中所有其他复选框，第一次单击全选时，其他复选框将选中显示的勾号。但是当取消选中全选并再次选择它时，其他复选框不会显示勾号，但是当查看源代码时，checked="checked" 会显示

【问题讨论】：

还要澄清你可怕的描述。
看到这个answer
JS 代码在那里 - 它在元素上：onclick="$('input[name*=\'selected\']').attr('checked', this.checked);"

标签： jquery html checkbox

【解决方案1】：

这不是很明显，但原始代码嵌入在上面的标记中。

注意$(…)的使用

<input type="checkbox" onclick="$('input[name*=\'selected\']').attr('checked', this.checked);">

变化：

.attr('checked', this.checked);

到：

.prop('checked', this.checked);

Demo

欲了解更多信息，请参阅$.prop - Attributed vs Properties

具体来说：

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

【讨论】：