Jquery 组 checkbox全选checkbox

<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="utf-8">
<title></title>
<style> </style>
</head>
<body>
<form action="">
<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/>
<input id="CheckedAll" type="checkbox"/>全选/不全不选
<input id="CheckedRev" type="button" name="items" value="反选"/>
<input id="send" type="button" name="items" value="提交"/>
</form>
</body>
<script src="js/jquery-1.11.3.js"></script>
<script>
//用原生js不会有问题
$("#CheckedAll").click(function(){
var thisAll=this;
if(thisAll.checked){
$('[name=items]:checkbox').each(function(){
this.checked=true;
});
}else{
$('[name=items]:checkbox').each(function(){
this.checked=false;
});
}
});
$('[name=items]:checkbox').click(function(){
var flag=true;
$('[name=items]:checkbox').each(function(){
if(!this.checked){
flag=false;
}
});
$("#CheckedAll")[0].checked=flag;
// $("#CheckedAll").attr('checked',flag);
});
$("#CheckedRev").click(function(){
$('[name=items]:checkbox').each(function(){
this.checked=!this.checked;
});
});
$("#send").click(function(){
var str="你选中的是: \r\n";
$('[name=items]:checkbox').each(function(){
// 用this.checked或者用$(this).context.checked,用attr不行
if(this.checked){
str+=$(this).val()+"\r\n";
}
});
console.log(str);
})
</script>
</html>
Jquery 组 checkbox全选checkbox的更多相关文章
- Jquery学习之路(一) 实现checkbox全选方法
昨天早上有写到怎么利用Jquery实现全选 根据大家的意见对程序中一些写法不好的地方进行了修改,也是本人水平有限,存在各种考虑不到的地方. 文章最后我提出了一个问题,要写一个通用的方法来调用,于是就有 ...
- checkbox全选,反选,取消选择 jquery
checkbox全选,反选,取消选择 jquery. //checkbox全部选择 $(":checkbox[name='osfipin']").each(function(){ ...
- 利用jQuery实现CheckBox全选/全不选/反选
转自:http://www.cnblogs.com/linjiqin/p/3148259.html jQuery有些版本中实现CheckBox全选/全不选/反选会有bug,经测试jquery-1.3. ...
- jQuery checkBox 全选的例子
表单处理时经常会有全选的功能,但是这个功能往往会被忽视一个细节,就是逐个选中 checkBox 直至全选时,经常会忘记修改全选 checkBox 的状态,某知名互联网公司的网盘就会出现这样的问题,问题 ...
- jquery数组之存放checkbox全选值示例代码
使用jquery数组可以存放checkbox全选值,下面有个不错的示例,感兴趣的朋友可以参考下. 复制代码代码如下: <input type="checkbox" id=&q ...
- jQuery实现CheckBox全选、全不选
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- jquery checkbox全选,全不选,反选方法,jquery checkbox全选只能操作一次
jquery checkbox全选,全不选,反选方法, jquery checkbox全选只能操作一次, jquery checkbox全选只有第一次成功 >>>>>&g ...
- jQuery设置checkbox全选(区别jQuery版本)
jQuery设置checkbox全选在网上有各种文章介绍,但是为什么在我们用他们的代码的时候就没有效果呢? 如果你的代码一点错误都没有,先不要急着怀疑人家代码的正确性,也许只是人家跟你用的jQuery ...
- jquery中checkbox全选失效的解决方法
这篇文章主要介绍了jquery中checkbox全选失效的解决方法,需要的朋友可以参考下 如果你使用jQuery 1.6 ,代码if ( $(elem).attr(“checked”) ),将 ...
随机推荐
- 编译安装nginx,并使用systemd管理nginx
#tar zxvf nginx-1.8.1.tar.gz #cd nginx-1.8.1/ #make && make install #cat /etc/systemd/system ...
- python3 练习题 day01
#练习题:'''1.简述变量命名规范'''#变量名由数字.字母.下划线组成#变量名可以字母和下划线开头,不能以数字开头,并且不能全为数字#变量名不能太长,且要有意义#最好使用驼峰或下划线格式命令#变量 ...
- Linux系统--命令行安装weblogic10.3.6
Linux下命令行安装weblogic10.3.6 一.安装前准备工作: 1.创建用户useradd weblogic;创建用户成功linux系统会自动创建一个和用户名相同的分组,并将该用户分到改组中 ...
- 1115 洛谷luogu最大子段和
题目描述 给出一段序列,选出其中连续且非空的一段使得这段和最大. 输入输出格式 输入格式: 第一行是一个正整数NNN,表示了序列的长度. 第二行包含NNN个绝对值不大于100001000010000的 ...
- PAT A1073 Scientific Notation (20 分)——字符串转数字
Scientific notation is the way that scientists easily handle very large numbers or very small number ...
- <转>cookie和session的区别
看到一篇讲cookie和session的文章,觉得蛮不错的,转载分享下... 原地址:http://www.lai18.com/content/407204.html?from=cancel cook ...
- 人人都是产品经理<2.0>
之前有看过<人人都是产品经理1.0>,还认真的做了笔记,看完后不久,得知作者在第一版的内容基础上,升华性的出了第二版,即<人人都是产品经理2.0>.注:第一版和第二版跨度有6年 ...
- Java原子类AtomicInteger实现原理的一点总结
java原子类不多,包路径位于:java.util.concurrent.atomic,大致有如下的类: java.util.concurrent.atomic.AtomicBoolean java. ...
- 关于LED效率,这4点你应该知道
关于LED效率,这4点你应该知道 发布时间:2017-08-22 12:09:35 原创:中国LED网 内容概要: 1. 这些灯的一些光通过转换器或磷光体转换成较长波长(绿色.黄色和红色光)的光,将所 ...
- linux编程头文件所在路径的问题
一.问题引入 1.头文件与库 当我们在PC主机linux环境下(如ubuntu),编写linux应用程序,然后利用gcc来编译.在源代码的开始位置会写入头文件,那是因为我们使用了系统提供的库函数,例如 ...