javascript - 重置当已选择的 checkbox 小勾

Question

页面有很多个 checkbox，希望点重置后，能够将小勾的选择恢复默认（默认情况下，有些勾是已选了的）
我尝试了用

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

结果那些默认已经选择了的内容也被清空了，有别的方法么？

Answer 1

可以在页面载入的时候先获取已经选中的checkbox.

$(function(){
    var $defaults = $('input:checkbox[checked]');
    function reset_checkeds(){
        $('input:checkbox').attr('checked', false);
        $defaults.attr('checked', true);
    }
});

然后重置的时候调用reset_checkeds函数就可以了:

<button type="button" onclick="reset_checkeds()">重置</button>

需要补充的是如果你的这些checkbox属于一个form表单,直接条用表单的reset方法就可以了.

Answer 2

用户点击时，添加一个 className 作标识

('input:checkbox').click(function(){$(this).addClass('userClick')})

需要重置的时候，使用

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

Answer 3

建议的解决方式就是在元素上写一个属性保存默认的选中状态。比如：

对应 <input type='checkbox' id='userName' data-checked='true' checked/>这样的默认状态。

重置的话，遍历一遍即可，如果data-checked为true，则默认选中，否则默认不选中