如何让checkbox在刷新页面后保持之前的状态

问题描述：

这个checkbox，假设选中后，刷新当前页面，让其保持选中状态，未选中，刷新后还是未选中，该怎么写，存在cookie里，然后用js控制checkbox的取值和赋值，不知道具体怎么写代码，新手，给完整代码

答

之前不是给过你了？你是单个还是多个checkbox？

 <div id="dvCBs">
    <input type="checkbox" name="cb" value="1" />cb1
    <br /><input type="checkbox" name="cb" value="2" />cb2
    <br /><input type="checkbox" name="cb" value="3" />cb3
</div>
<script>
    var dv = document.getElementById('dvCBs'), cbs = dv.getElementsByTagName('input');
    dv.onclick = function (e) {
        e = e || window.event;
        var o = e.target || e.srcElement;
        if (o.type == 'checkbox') {
            var vs = '';
            for (var i = 0; i < cbs.length; i++)
                if (cbs[i].checked) vs += ',' + cbs[i].value;
            document.cookie = 'vs=' + vs.substring(1);//存储选中的checkbook的值
        }
    }
    var m = /(^| |;)vs=([^;]+)/.exec(document.cookie);
    if (m) {//cookie中有值，初始化勾选状态
        var arr = m[2].split(',');
        for(var j=0;j<arr.length;j++)
            for(var i=0;i<cbs.length;i++)
                if (cbs[i].value == arr[j]) { cbs[i].checked = true; break;}
    }
</script>

答

用JS修改checkbox的选中状态

代码如下：

答

<br> $(function(){</p> <pre><code> $("input:checkbox").each(function() { if($.cookie($(this).attr('name'))*1==1) { $(this).prop('checked','checked'); } }) $("input:checkbox").change(function() { if($(this).prop('checked')) { $.cookie($(this).attr('name'), 1); } else { $.cookie($(this).attr('name'), 0); } }); }) </code></pre> <p>

c1

c2

相关js自己导入

答

...失误了再来一次

 <html>
<head>
 <script type="text/javascript" src="jquery-1.11.3.min.js"></script>
 <script type="text/javascript" src="jquery.cookie.js"></script>
 <script>
    $(function(){

        $("input:checkbox").each(function()
        {
            if($.cookie($(this).attr('name'))*1==1)
            {
                $(this).prop('checked','checked');
            }

        })

         $("input:checkbox").change(function() {

            if($(this).prop('checked'))
            {

                $.cookie($(this).attr('name'), 1);
            }
            else
            {

                $.cookie($(this).attr('name'), 0);
            }

         });

    })
 </script>
</head>
<body>
<input name="c1" type="checkbox"></input> c1
<br/>
<input name="c2" type="checkbox"></input> c2
</body>
</html>

如何让checkbox在刷新页面后保持之前的状态

相关推荐