如何让checkbox在刷新页面后保存记录状态源码
刷新当前页面，让其保持选中状态，未选中，刷新后还是未选中
实例
```
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<script src="./jquery/jquery.min.js"></script>
</head>
<body>
<div id="dvCBs">
<input type="checkbox" checked="checked" name="cb" value="0"/>cb1
<br /><input type="checkbox" name="cb" value="1" />cb2
<br /><input type="checkbox" name="cb" value="2" checked="checked"/>cb3
<br /><input type="checkbox" name="cb" value="3" checked="checked"/>cb4
<br /><input type="checkbox" name="cb" value="4" checked="checked"/>cb5
<br /><input type="checkbox" name="cb" value="5" checked="checked"/>cb6
<br /><input type="checkbox" name="cb" value="6" checked="checked"/>cb7
</div>
```
<script>
console.log($("input[type='checkbox']").eq(0).is(':checked'));
///IQNAG
var dv = document.getElementById('dvCBs')
var k = dv.getElementsByTagName('input');
var arr = [];
function lad(){
arr = [];
for(var i =0; i<k.length;i++){
var gouxuan=k[i].hasAttribute('checked');
if(!gouxuan){
arr.push(i);
}
}
console.log(arr);
}
var dv = document.getElementById('dvCBs'), cbs = dv.getElementsByTagName('input');
dv.onclick = function (e) {
lad()
e = e || window.event;
var o = e.target || e.srcElement;
console.log(o);
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的值
console.log(document.cookie);
}
}
var m = /(^| |;)vs=([^;]+)/.exec(document.cookie);
if (m) {//cookie中有值，初始化勾选状态
var arr = m[2].split(',');
$("#dvCBs input").removeAttr("checked")
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>
```
</body>
</html>
```
<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>
获取input的checked
$(".input").click(function(){
console.log($(this))
/
$(".dropdown-menu input[checked]").each(function () {
console.log($(this).attr("checked")); });
console.log($(this).prop('checked'));
console.log($(this).is(':checked'));
console.log($(".dropdown-menu input").is(':checked'));
})
可以借助localStorage保存状态
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="jquery-1.11.1.min.js"></script>
</head>
<body>
<div id="cb">
<input type="checkbox" name="" id="cb1" />
<input type="checkbox" name="" id="cb2" />
<input type="checkbox" name="" id="cb3" />
<input type="checkbox" name="" id="cb4" />
<input type="checkbox" name="" id="cb5" />
</div>
<script>
$("#cb input").change(function(){
var b = $(this).is(":checked");
localStorage.setItem('checkbox', b);
});
$(function(){
if(localStorage.checkbox == "true"){
$("#cb input").prop("checked", "checked");
}
});
</script>
</body>
</html>
