<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>checkbox</title>
<script src="bin/jquery.min.js"></script>
<script>
$(function(){
// 全选/全不选
$("#checkAll_2").click(function(){
$(":checkbox[name='items']").attr("checked", $(this).is(":checked"));
});
$(":checkbox[name='items']").click(function(){
// alert($(":checkbox[name='items']").length); //全选中的个数
// alert($(":checkbox[name='items']:checked").length );//当前选中的个数
var flag = $(":checkbox[name='items']").length == $(":checkbox[name='items']:checked").length ;
$("#checkAll_2").attr("checked", flag);
});
//全选
$("#checkAll").click(function(){
$(":checkbox[name='items']").attr("checked" , "checked");
});
//全不选
$("#checkNo").click(function(){
// $(":checkbox[name='items']").attr("checked" , "");
$(":checkbox[name='items']").removeAttr("checked");
})
// 反选
$("#checkRev").click(function(){
$(":checkbos[name='items']").each(function(){
if($(this).is(":checked")){
$(this).removeAttr("checked");
} else {
$(this).attr("checked", "checked");
}
})
});
});
</script>
</head>
<body>
<form>
你最爱好的运动是? <br>
<input type="checkbox" id="checkAll_2">全选/全不选
<br>
<input type="checkbox" name="items" value="足球">足球
<input type="checkbox" name="items" value="蓝球">蓝球
<input type="checkbox" name="items" value="羽毛球">羽毛球
<input type="checkbox" name="items" value="乒乓球">乒乓球
<br>
<br>
<input type="button" id="checkAll" value="全选">
<input type="button" id="checkNo" value="全不选">
<input type="button" id="checkRev" value="反选">
<input type="button" id="send" value="提交">
</form>
</body>
</html>
分享到：
相关推荐
jquery实现全选反选全不选案例，在入场网页开发中实现。
jQuery有些版本中实现CheckBox全选/全不选/反选会有bug，经测试jquery-1.3.1.js–>测试通过，jquery-1.5.1.js–>测试不通过。 实现CheckBox全选/全不选/反选代码如下： <%@ page language="java" ...
实现全选，全不选，反选，获取选中的值 。
本文主要介绍下jquery另一种全选、全不选、反选的方式(与原生js混合使用)，感兴趣的朋友可以参考下哈，希望对你有所帮助
JQuery实现全选、全不选、反选功能 1、当点击'全选'按钮时，页面中所有的复选框都应该为选中状态， 1.1、当再次点击'全选'按钮时，所有的复选框应该是非选中状态。 1.2、当点击子复选框时，'全选'按钮应该是非选中...
日常项目中, 对于列表类文章或数据, 大概都会用到checkbox的全选或全不选的功能, 以前的项目中也写过checkbox的选择js, 但都没有整理过. 正好前几天一个兄弟遇到了这个问题, 索性, 我花了点时间, 用原生JS与jQuery...
本文实例讲述了js与jQuery实现checkbox复选框全选/全不选的方法。分享给大家供大家参考，具体如下： 先来看看JavaScript实现checkbox复选框全选/全不选的方法。这应该是一个比较实用的前端技巧吧，很多时候我们都...
jquery 复选框 全选，全不选,在同一个按钮实现，格式是html
jquery Checkbox 全选 反选 全不选 多种实现方法 和表单验证
本篇文章主要是对jquery实现checkbox 全选/全不选的通用写法进行了介绍，需要的朋友可以过来参考下，希望对大家有所帮助
jQuery全选、反选与获取选中值 jQuery全选、反选与获取选中值 jQuery全选、反选与获取选中值 jQuery全选、反选与获取选中值
主要介绍了jQuery实现的复选框全选/取消全选/反选及获得选择的值,需要的朋友可以参考下
js，jquery全选/全不选，批量新增删除/单个删除操作，常用于后台管理系统类多行表格操作
jQuery 实现全选反选 全不选
jQuery实现按钮的点击 全选/反选 单选框/复选框 文本框 表单验证 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <base href="<%=basePath%>"> &...
《锋利的jquery》利用this.checked判断全选与全不选