今天给大家分享一段基于jQuery的全选、反选与获取选中值。文章结合demo，代码简洁，基本覆盖选项选择操作的方方面面，希望可以帮到有喜欢前端的朋友们。
HTML
我们拿音乐网站的歌曲列表来讲述jQuery全选、反选、不选及获取选中值。
<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.心痛2013</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" />
最后讲解下 allCheck()，它是来检测全选框应该是选中状态还是未选中状态的，代码如下：
function allCheck() {
var num_all = $("#list :checkbox").size(); //选项总个数
var num_checked = $("#list :checkbox:checked").size(); //选中个数
if (num_all == num_checked) { //若选项总个数等于选中个数
$("#all").attr("checked", true); //全选选中
} else {
$("#all").attr("checked", false);
}
}
