开发者社区> 问答> 正文

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

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

展开
收起
小旋风柴进 2016-03-19 13:02:52 5110 0
1 条回答
写回答
取消 提交回答
  •  <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>
    
    2019-07-17 19:08:03
    赞同 展开评论 打赏
问答分类:
问答地址:
相关产品:
问答排行榜
最热
最新

相关电子书

更多
低代码开发师(初级)实战教程 立即下载
冬季实战营第三期:MySQL数据库进阶实战 立即下载
阿里巴巴DevOps 最佳实践手册 立即下载