jQuery全选,全不选,反选

来源:互联网 发布:淘宝请买家提供凭证 编辑:程序博客网 时间:2024/06/05 08:44

 //简单的实现全选与全不选
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
<title>Index</title> 
<script src="http://img.jb51.net/jslib/jquery/jquery14.js"></script> 
<script type="text/javascript"> 
$(function() { 
$("#CheckAll").click(function() { 
var flag = $(this).attr("checked"); 
$("[name=subBox]:checkbox").each(function() { 
$(this).attr("checked", flag); 
}) 
}) 
}) 
</script> 
</head> 
<body> 
<div> 
<input id="CheckAll" type="checkbox" />全选 
<input name="subBox" type="checkbox" />1 
<input name="subBox" type="checkbox" />2 
<input name="subBox" type="checkbox" />3 
<input name="subBox" type="checkbox" />4 
</div> 
</body> 
</html> 

//实现全选全不选与反选

<script src="http://img.jb51.net/jslib/jquery/jquery14.js"></script> 

<script type="text/javascript"> 
//全选 
function CheckedAll(){ 
$(':checkbox').attr('checked','checked'); 


//全不选 
function CheckedNo(){ 
$(':checkbox').attr('checked',''); 


//反选 
function CheckedRev(){ 
var arr = $(':checkbox'); 
for(var i=0;i<arr.length;i++){ 
arr[i].checked = ! arr[i].checked; 


</script> 
<body> 
<div> 
<input id="CheckAll" type="checkbox" /> 
<input name="subBox" type="checkbox" /> 
<input name="subBox" type="checkbox" /> 
<input name="subBox" type="checkbox" /> 
<input name="subBox" type="checkbox" /> 
</div> 
<input type="button" name="btnCheckedAll" value="全 选" onclick="javascript:CheckedAll();" /> 
<input type="button" name="btnCheckedNo" value="全不选" onclick="javascript:CheckedNo();" /> 
<input type="button" name="btnCheckedRev" value="反 选" onclick="javascript:CheckedRev();" />
</body>