$(function () { var dv = document.getElementById('test'), 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 defer="defer" src="ckeckBoxReload.js"></script>
注:有时候会有页面控制台输出有值为HTMLcollection类型可是length获取为空的状况,这个时由于dom没有加载完成就去获取它的属性致使的须要在引入该js时加入defer=“defer”来控制 可是这个只能用于外部引入方式html