利用JQuery实现复选框的基本操作，例如全选、全部选、获取选中值、获取未选中值、获取选中长度等操作。
下面直接看例子，例子中有详细的介绍了JQuery是如何实现这些功能的。
在使用JQuery之前要先导入JQuery的相关文件，我这里引入的是jquery-1.8.0.min.js
<html>
<head>
<meta charset="UTF-8">
<title>js中字符串处理</title>
</head>
<script type="text/javascript" src="js/jquery-1.8.0.min.js"></script>
<script type="text/javascript">
$(function() {
});
function checkBoxFuc(){
var str="";
$('input:checkbox').each(function() {
if ("checked"==$(this).attr('checked')) {
str=str+$(this).val()+",";
}
});
str="<h1>"+str+"</h1>";
$("#checkBoxId").html(str);
};
function checkBoxEdFuc(){
var str="";
$('input:checkbox').each( function(){
var self=$(this);
if(!self.prop('checked')){
str=str+self.val()+",";
}
});
str="<h1>"+str+"</h1>";
$("#checkBoxEdId").html(str);
};
function allCheckBoxEdFuc(){
$('input:checkbox').each(function(){
var self=$(this);
if(!self.prop('checked')){
self.prop('checked',true);
}
});
};
function notAllCheckBoxEdFuc(){
$('input:checkbox').each(function(){
var self=$(this);
if(self.prop('checked')){
self.prop('checked',false);
}
});
};
function numberFuc(){
var length="<h1>选中的个数为："+$('input:checkbox:checked').length+"</h1>";
$("#numberId").html(length);
};
function noNumberFuc(){
var allLength=+$('input:checkbox').length;
var checkedLength=$('input:checkbox:checked').length;
var length=allLength-checkedLength;
$("#noNumberId").html("<h1>未选中个数为："+length+"</h1>");
}
function allNumberFuc(){
var length="<h1>总个数为："+$('input:checkbox').length+"</h1>";
$("#allNumberId").html(length);
};
function firstLastFuc(){
$('input:checkbox:first').attr("checked",'true');
$('input:checkbox:last').attr("checked",'true');
};
function checkNumber(){
var number=$("#checkId").val();
//$('input:checkbox').eq(number-1).attr("checked",'true');
$('input:checkbox').eq(number-1).prop("checked",true);
}
</script>
<body>
<input type="checkbox" value="1">1
<input type="checkbox" value="2">2
<input type="checkbox" value="3">3
<input type="checkbox" value="4">4
<input type="checkbox" value="5">5
<input type="checkbox" value="6">6
<input type="checkbox" value="7">7
<input type="checkbox" value="8">8</br>
<input type="button" value="选中的值有：" οnclick="checkBoxFuc();"><p id="checkBoxId"></p>
<input type="button" value="未选中的值有：" οnclick="checkBoxEdFuc();"><p id="checkBoxEdId"></p>
<input type="button" value="全选：" οnclick="allCheckBoxEdFuc();"><p id="allCheckBoxEdId"></p>
<input type="button" value="全不选：" οnclick="notAllCheckBoxEdFuc();"><p id="notAllCheckBoxEdId"></p>
<input type="button" value="选中的个数：" οnclick="numberFuc();"><p id="numberId"></p>
<input type="button" value="未选中的个数：" οnclick="noNumberFuc();"><p id="noNumberId"></p>
<input type="button" value="总个数：" οnclick="allNumberFuc();"><p id="allNumberId"></p>
<input type="button" value="选中第一个和最后一个：" οnclick="firstLastFuc();"><p id="firstLastId"></p>
<input id="checkId" type="text"/><input type="button" value="选中需要选中的号数" οnclick="checkNumber();">
</body>
</html>
