jQuery checkbox全选/取消全选实现代码


Posted in Javascript onNovember 14, 2009

jQuery版本:1.3.2

<html> 
<head> 
<script src="jquery-1.3.2.min.js" type="text/javascript"></script> 
</head> 
<body> 
<input type="checkbox" name="chk_list" id="chk_list_1" value="1" />1<br /> 
<input type="checkbox" name="chk_list" id="chk_list_2" value="2" />2<br /> 
<input type="checkbox" name="chk_list" id="chk_list_3" value="3" />3<br /> 
<input type="checkbox" name="chk_list" id="chk_list_4" value="4" />4<br /> 
<input type="checkbox" name="chk_all" id="chk_all" />全选/取消全选 
<script type="text/javascript"> 
$("#chk_all").click(function(){ 
$("input[name='chk_list']").attr("checked",$(this).attr("checked")); 
}); 
</script> 
</body> 
</html>

jQuery.attr 获取/设置对象的属性值,如:
$("input[name='chk_list']").attr("checked"); //读取所有name为'chk_list'对象的状态(是否选中) 
$("input[name='chk_list']").attr("checked",true); //设置所有name为'chk_list'对象的checked为true

再如:
$("#img_1").attr("src","test.jpg"); //设置ID为img_1的<img>src的值为'test.jpg' 
$("#img_1").attr("src"); //读取ID为img_1的<img>src值

下面的代码是获取上面实例中选中的checkbox的value值:
<script type="text/javascript"> 
//获取到所有name为'chk_list'并选中的checkbox(集合) 
var arrChk=$("input[name='chk_list][checked]"); 
//遍历得到每个checkbox的value值 
for (var i=0;i<arrChk.length;i++) 
{ 
alert(arrChk[i].value); 
} 
</script>

哪位高手能把上面遍历的过程用$.each()写出来,不胜感激。
Javascript 相关文章推荐
document.documentElement的一些使用技巧
Apr 18 Javascript
高效率JavaScript编写技巧整理
Aug 23 Javascript
javascript校验价格合法性实例(必须输入2位小数)
May 05 Javascript
如何动态加载外部Javascript文件
Dec 02 Javascript
超赞的jQuery图片滑块动画特效代码汇总
Jan 25 Javascript
jquery获取文档高度和窗口高度汇总
Jan 25 Javascript
JavaScript的兼容性与调试技巧
Nov 22 Javascript
VUE 更好的 ajax 上传处理 axios.js实现代码
May 10 Javascript
微信小程序内拖动图片实现移动、放大、旋转的方法
Sep 04 Javascript
关于layui的下拉搜索框异步加载数据的解决方法
Sep 28 Javascript
Vue使用路由钩子拦截器beforeEach和afterEach监听路由
Nov 16 Javascript
js用正则表达式筛选年月日的实例方法
Jan 04 Javascript
jQuery帮助之CSS尺寸(五)outerHeight、outerWidth
Nov 14 #Javascript
jquery 可排列的表实现代码
Nov 13 #Javascript
javascript 带有滚动条的表格,标题固定,带排序功能.
Nov 13 #Javascript
传智播客学习之JavaScript基础篇
Nov 13 #Javascript
用document.documentElement取代document.body的原因分析
Nov 12 #Javascript
JQuery SELECT单选模拟jQuery.select.js
Nov 12 #Javascript
Jquery操作Select 简单方便 一个js插件搞定
Nov 12 #Javascript
You might like
一个odbc连mssql分页的类
2006/10/09 PHP
PHP中Date获取时间不正确怎么办
2008/06/05 PHP
微盾PHP脚本加密专家php解密算法
2020/09/13 PHP
解析PHP留言本模块主要功能的函数说明(代码可实现)
2013/06/25 PHP
php缩小png图片不损失透明色的解决方法
2013/12/25 PHP
PHP调用VC编写的COM组件实例
2014/03/29 PHP
php验证码的制作思路和实现方法
2015/11/12 PHP
PHP实现的最大正向匹配算法示例
2017/12/19 PHP
PHP框架实现WebSocket在线聊天通讯系统
2019/11/21 PHP
PHP pthreads v3下worker和pool的使用方法示例
2020/02/21 PHP
JavaScript读取中文cookie时的乱码问题的解决方法
2009/10/14 Javascript
JavaScript获取并更改input标签name属性的方法
2015/07/02 Javascript
详解js中class的多种函数封装方法
2016/01/03 Javascript
bootstrap模态框示例代码分享
2017/05/17 Javascript
Vue中通过vue-router实现命名视图的问题
2020/04/23 Javascript
[29:16]完美世界DOTA2联赛决赛日 Inki vs LBZS 第三场 11.08
2020/11/10 DOTA
跟老齐学Python之画圈还不简单吗?
2014/09/20 Python
Python Grid使用和布局详解
2018/06/30 Python
使用python实现http及ftp服务进行数据传输的方法
2018/10/26 Python
mac PyCharm添加Python解释器及添加package路径的方法
2018/10/29 Python
Python3之不使用第三方变量,实现交换两个变量的值
2019/06/26 Python
Python logging设置和logger解析
2019/08/28 Python
Django实现WebSSH操作物理机或虚拟机的方法
2019/11/06 Python
前端canvas动画如何转成mp4视频的方法
2019/06/17 HTML / CSS
中国领先的专业演出票务网:永乐票务
2016/08/29 全球购物
次世代生活态度:Hypebeast
2018/07/05 全球购物
奥地利智能家居和智能生活网上商店:tink.at
2019/10/07 全球购物
Linux不知道文件后缀名怎么判断文件类型
2012/04/26 面试题
北京捷通华声语音技术有限公司Java软件工程师笔试题
2012/04/10 面试题
翻译专业应届生求职信
2013/11/23 职场文书
小学毕业感言500字
2014/02/28 职场文书
技术总监管理岗位职责
2014/03/09 职场文书
小学生竞选班干部演讲稿(5篇)
2014/09/12 职场文书
学校重阳节活动总结
2015/03/24 职场文书
导游词之河北白洋淀
2020/01/15 职场文书
解决go在函数退出后子协程的退出问题
2021/04/30 Golang