})
}
});
给出使用jQuery事先的全选和全不选:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>复选框</title>
<script src="https://cdn.bootcss.com/jquery/3.1.0/jquery.min.js"></script>
<script type="text/javascript">
$(function() {
$("#all").click(function () {
if (this.checked) {
$("#list :checkbox").each(function () {
$(this).prop("checked", true); //选择器要有空格隔开
})
} else {
$("#list :checkbox").each(function () {
$(this).prop("checked", false);
})
}
});
//第二种
// $("#all").click(function(){
// if(this.checked){
// $("#list :checkbox").prop("checked", true);
// }else{
// $("#list :checkbox").prop("checked", false);
// }
// }); //全选
$("#selectAll").click(function () {
$("#list :checkbox,#all").prop("checked", true);
});
//全不选
$("#unSelect").click(function () {
$("#list :checkbox,#all").prop("checked", false);
});
//反选
$("#reverse").click(function () {
$("#list :checkbox").each(function () {
// $(this).prop("checked", !$(this).prop("checked"));
this.checked=!this.checked;
});
if($('#list :checkbox:checked').length==$("#list :checkbox").length){
$("#all").prop("checked",true);
}
else{
$("#all").prop("checked",false);
}
});
//获取选中的值
$("#getValue").click(function(){
var valArr = new Array();
$("#list :checkbox:checked").each(function(i){ //判断被选中的
valArr[i] = $(this).val();
})
var vals = valArr.join(',');//转换为逗号隔开的字符串
alert(vals);
});
})
</script>
</head>
<body>
<ul id="list">
<li><label><input type="checkbox" value="1.广东省">广东省 </label></li>
<li><label><input type="checkbox" value="2.广西省">广西省 </label></li>
<li><label><input type="checkbox" value="3.河南省">河南省 </label></li>
<li><label><input type="checkbox" value="4.福建省">福建省 </label></li>
<li><label><input type="checkbox" value="5.湖南省">湖南省 </label></li>
<li><label><input type="checkbox" value="6.江西省">江西省 </label></li>
</ul>
<input type="checkbox" id="all">
<input type="button" value="全选" class="btn" id="selectAll">










