jQuery操作復選框的選中和不選中狀態非常簡單，使用attr()來設置"checked"屬性的值，true未選中，false為未選中，在整個全選、反選過程中注意處理全選復選框的選中狀態，以及獲取選中選項的值。
<ul id="list">
<li><label><input type="checkbox" value="1">1.我是記錄來的呢</label></li>
<li><label><input type="checkbox" value="2">2.哈哈，真的太天真了</label></li>
<li><label><input type="checkbox" value="3">3.愛上你是我的錯嗎？</label></li>
<li><label><input type="checkbox" value="4">4.從開始你就不應用愛上我</label></li>
<li><label><input type="checkbox" value="5">5.喜歡一個人好難</label></li>
<li><label><input type="checkbox" value="6">6.你在那里呢</label></li>
</ul>
<input type="checkbox" id="all">
<input type="button" value="全選"class="btn" id="selectAll">
<input type="button" value="全不選"class="btn" id="unSelect">
<input type="button" value="反選"class="btn" id="reverse">
<input type="button" value="獲得選中的所有值"class="btn" id="getValue">
$(function(){
//全選或全不選
$("#all").click(function(){
if(this.checked){
$("#list :checkbox").attr("checked",true);
}else{
$("#list :checkbox").attr("checked",false);
}
});
//全選
$("#selectAll").click(function(){
$("#list :checkbox,#all").attr("checked",true);
});
//全不選
$("#unSelect").click(function(){
$("#list :checkbox,#all").attr("checked",false);
});
//反選*****
$("#reverse").click(function(){
$("#list :checkbox").each(function(){
$(this).attr("checked",!$(this).attr("checked"));
});
allchk();
});
//設置全選復選框
$("#list :checkbox").click(function(){
allchk();
});
//獲取選中選項的值
$("#getValue").click(function(){
var valArr =newArray;
$("#list :checkbox[checked]").each(function(i){
valArr[i]= $(this).val();
});
var vals = valArr.join(',');
alert(vals);
});
});
function allchk(){
var chknum = $("#list :checkbox").size();//選項總個數
var chk =0;
$("#list :checkbox").each(function(){
if($(this).attr("checked")==true){
chk++;
}
});
if(chknum==chk){//全選
$("#all").attr("checked",true);
}else{//不全選
$("#all").attr("checked",false);
}
}