jquery一句话全选/取消全选


Posted in Javascript onMarch 01, 2011

1、当然要引入jquery文件啦。
2、建立函数
var check_all = function(obj,name){$(":checkbox[name='"+name+"']").attr("checked",obj.checked); }
3、使用

<!DOCTYPE Html> 
<html> 
<head> 
<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.4.min.js"></script> 
<script type="text/javascript"> 
function selectAll(checkbox) { 
$('input[type=checkbox]').attr('checked', $(checkbox).attr('checked')); 
} 
</script> 
</head> 
<body> 
<input type="checkbox" onclick="selectAll(this);" />全选<br/> 
<input type="checkbox" /><br/> 
<input type="checkbox" /><br/> 
<input type="checkbox" /><br/> 
<input type="checkbox" /><br/> 
<input type="checkbox" /><br/> 
<input type="checkbox" /><br/> 
…… 
</body> 
</html>

多组的JQUERY选中与取消
<head> 
<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.4.min.js"></script> 
<script type="text/javascript"> 
function selectGroup(checkbox,obj) { 
$('input[name='+obj+']').attr('checked', $(checkbox).attr('checked')); 
} 
</script> 
</head> 
<body> 
<input type="checkbox" onclick="selectGroup(this,'grp1');" />选中GROUPA<br/> 
GROUPA:<br/> 
<input type="checkbox" name="grp1" />11<br/> 
<input type="checkbox" name="grp1" />22<br/> 
<input type="checkbox" name="grp1" />33<br/><br/> 
<input type="checkbox" onclick="selectGroup(this,'grp2');" />选中GROUPB<br/> 
GROUPB:<br/> 
<input type="checkbox" name="grp2" />44<br/> 
<input type="checkbox" name="grp2" />55<br/> 
<input type="checkbox" name="grp2" />66<br/> 
</body> 
</html>

另外的补充代码:
引用Jquery 库jquery-1.4.1-vsdoc.js 等

Jquery脚本代码——————————————————————

$(function() { 
$('#inputCheck').click(function() { 
$("input[name='Checkbox1']").attr("checked", $(this).attr("checked")); 
}); 
}); // 全选 $(function() { 
$("#select_reverse").click(function() { 
$("input[name='Checkbox1']").each(function(idx, item) { 
$(item).attr("checked", !$(item).attr("checked")); 
}) 
}); 
});//反选

html 前台代码————————————————————————
[code]
<input id="inputCheck" type="checkbox" />全选
<input id="select_reverse" type="checkbox" />反选
<input name="Checkbox1" type="checkbox" />
<input name="Checkbox1" type="checkbox" />
<input name="Checkbox1" type="checkbox" />
<input name="Checkbox1" type="checkbox" />
<input name="Checkbox1" type="checkbox" />
<input name="Checkbox1" type="checkbox" />
[html]
Javascript 相关文章推荐
js如何判断用户是在PC端和还是移动端访问
Apr 24 Javascript
使用VS开发 Node.js指南
Jan 06 Javascript
jQuery实现文本框输入同步的方法
Jun 20 Javascript
javascript随机抽取0-100之间不重复的10个数
Feb 25 Javascript
JavaScript重载函数实例剖析
May 13 Javascript
基于Bootstrap实现tab标签切换效果
Apr 15 Javascript
jQuery插件简单学习实例教程
Jul 01 Javascript
AngularJS创建自定义指令的方法详解
Nov 03 Javascript
如何实现星星评价(jquery.raty.js插件)
Dec 21 Javascript
浅谈原型对象的常用开发模式
Jul 22 Javascript
Vue自定义组件的四种方式示例详解
Feb 28 Javascript
javascript 函数的暂停和恢复实例详解
Apr 25 Javascript
基于jQuery的Tab选项框效果代码(插件)
Mar 01 #Javascript
jquery中实现标签切换效果的代码
Mar 01 #Javascript
IE图片缓存document.execCommand(&quot;BackgroundImageCache&quot;,false,true)
Mar 01 #Javascript
收集的10个免费的jQuery相册
Feb 26 #Javascript
jQuery 1.5.1 发布,全面支持IE9 修复大量bug
Feb 26 #Javascript
20款超赞的jQuery插件 Web开发人员必备
Feb 26 #Javascript
js对象的比较
Feb 26 #Javascript
You might like
Apache, PHP在Windows 9x/NT下的安装与配置 (一)
2006/10/09 PHP
分享十款最出色的PHP安全开发库中文详细介绍
2015/03/22 PHP
js几个不错的函数 $$()
2006/10/09 Javascript
arguments对象
2006/11/20 Javascript
JavaScript中的new的使用方法与注意事项
2007/05/16 Javascript
写出更好的JavaScript程序之undefined篇(中)
2009/11/23 Javascript
JS 遮照层实现代码
2010/03/31 Javascript
jQuery DOM删除节点操作指南
2015/03/03 Javascript
ubuntu下安装nodejs以及升级的办法
2015/05/08 NodeJs
配置Grunt的Task时通配符支持和动态生成文件名问题
2015/09/06 Javascript
js获取上传文件的绝对路径实现方法
2016/08/02 Javascript
JS实现的表格行上下移动操作示例
2016/08/03 Javascript
AngularJS实现数据列表的增加、删除和上移下移等功能实例
2016/09/05 Javascript
JS刷新父窗口的几种方式小结(推荐)
2016/11/09 Javascript
Vue 将后台传过来的带html字段的字符串转换为 HTML
2018/03/29 Javascript
详解Vue-cli webpack移动端自动化构建rem问题
2018/04/07 Javascript
JS实现获取word文档内容并输出显示到html页面示例
2018/06/23 Javascript
浅谈关于iview表单验证的问题
2018/09/29 Javascript
React中Ref 的使用方法详解
2020/04/28 Javascript
[50:38]DOTA2-DPC中国联赛 正赛 Phoenix vs CDEC BO3 第二场 3月7日
2021/03/11 DOTA
python3 与python2 异常处理的区别与联系
2016/06/19 Python
python保存字典和读取字典的实例代码
2019/07/07 Python
flask应用部署到服务器的方法
2019/07/12 Python
浅谈python3中input输入的使用
2019/08/02 Python
python创建n行m列数组示例
2019/12/02 Python
python 解决mysql where in 对列表(list,,array)问题
2020/06/06 Python
来自世界各地的优质葡萄酒:VineShop24
2018/07/09 全球购物
端口镜像是怎么实现的
2014/03/25 面试题
Python面试题集
2012/03/08 面试题
文明家庭先进事迹材料
2014/05/14 职场文书
五一活动标语
2014/06/30 职场文书
导游词之茶卡盐湖
2019/11/26 职场文书
Golang中interface{}转为数组的操作
2021/04/30 Golang
一级电子管军用接收机测评
2022/04/05 无线电
MySQL数据库 任意ip连接方法
2022/05/20 MySQL
Android移动应用开发指南之六种布局详解
2022/09/23 Java/Android