jQuery实现复选框全选反选源码

今天有时间写个用jQuery实现复选框全选反的效果。我把代码写出来共享一下。有需要的尽管去。*提示: 注意jQuery路径

<!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>
<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />
<title>jQuery 复选框全选</title>
</head>
<script src=”http://www.086php.com/jquery-1.5.min.js”></script>
<body>
<input type=”checkbox” name=”checkbox[]” value=”1″>
<input type=”checkbox” name=”checkbox[]” value=”2″ >
<input type=”checkbox” name=”checkbox[]” value=”3″>
<input type=”checkbox” name=”checkbox[]” value=”4″>
<input type=”checkbox” name=”checkbox[]” value=”5″>
<input type=”checkbox” name=”checkbox[]” value=”6″>
<input type=”checkbox” name=”checkbox[]” value=”1″>
<input type=”checkbox” name=”checkbox[]” value=”2″ >
<input type=”checkbox” name=”checkbox[]” value=”3″>
<input type=”checkbox” name=”checkbox[]” value=”4″>
<input type=”checkbox” name=”checkbox[]” value=”5″ >
<input type=”checkbox” name=”checkbox[]” value=”6″>
<p>全选<input type=”checkbox” name=”checkbox[]” id=”yes”></p>
<p>反选<input type=”checkbox” name=”checkbox[]” id=”no”></p>
<body>
<script>
function jQueryCheckboxd(yse_id, no_id) {
$(function(){
var $yse_checkbox = $(yse_id); //控制全选复选框的id
var $no_checkbox = $(no_id); //控制反选复选框的id
var cr = $yse_checkbox.get(0);
var cy = $no_checkbox.get(0);

//全选功能 2011年3月23日
$yse_checkbox.click(function(){
$(“input[type='checkbox']“).each(function(){
if(cr.checked){
$(this).attr(‘checked’, ‘checked’);
$($no_checkbox).removeAttr(‘checked’);
}else{
$(this).removeAttr(‘checked’);
}
});
});

//反选功能 2011年3月23日
$no_checkbox.click(function(){
$(“input[type='checkbox']“).each(function(){
if($(this).is(‘:checked’)){
$(this).removeAttr(‘checked’);
//$(this).attr(‘checked’, ‘checked’);
} else if(!($(this).is(‘:checked’))){
//alert(‘没有选中的’+$(this).val());
$(this).attr(‘checked’, ‘checked’);
$($yse_checkbox).removeAttr(‘checked’);
}
});
});

})
}
jQueryCheckboxd(‘#yes’, ‘#no’);
</script>
</html>

下载代码

发表评论

电子邮件地址不会被公开。 必填项已用 * 标注

*

您可以使用这些 HTML 标签和属性: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>