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 相关文章推荐
IE下使用cloneNode注意事项分享
Nov 22 Javascript
JS注册/移除事件处理程序(ExtJS应用程序设计实战)
May 07 Javascript
JS+CSS实现下拉列表框美化效果(3款)
Aug 15 Javascript
JS+CSS实现带有碰撞缓冲效果的竖向导航条代码
Sep 15 Javascript
PHP 实现一种多文件上传的方法
Sep 20 Javascript
jQuery解析json格式数据示例
Sep 01 jQuery
「中高级前端面试」JavaScript手写代码无敌秘籍(推荐)
Apr 08 Javascript
vue elementUI table 自定义表头和行合并的实例代码
May 22 Javascript
简单了解小程序+node梳理登陆流程
Jun 24 Javascript
Vue 实现前端权限控制的示例代码
Jul 09 Javascript
使用Vue.js中的过滤器实现幂方求值的方法
Aug 27 Javascript
如何使用RoughViz可视化Vue.js中的草绘图表
Jan 30 Vue.js
基于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
php中的时间处理
2006/10/09 PHP
PHP学习散记_编码(json_encode 中文不显示)
2011/11/10 PHP
php中将字符串转为HTML的实体引用的一个类
2013/02/03 PHP
php实现将任意进制数转换成10进制的方法
2015/04/17 PHP
PHP IDE phpstorm 常用快捷键
2015/05/18 PHP
MacOS下PHP7.1升级到PHP7.4.15的方法
2021/02/22 PHP
javascript学习笔记(六) Date 日期类型
2012/06/19 Javascript
原生js和jQuery随意改变div属性style的名称和值
2014/10/22 Javascript
jQuery+AJAX实现无刷新下拉加载更多
2015/07/03 Javascript
JavaScript实现自动生成网页元素功能(按钮、文本等)
2015/11/21 Javascript
详解windows下vue-cli及webpack 构建网站(三)使用组件
2017/06/17 Javascript
vue.js组件vue-waterfall-easy实现瀑布流效果
2017/08/22 Javascript
Javacript中自定义的map.js  的方法
2017/11/26 Javascript
vue添加class样式实例讲解
2019/02/12 Javascript
Vue源码学习之关于对Array的数据侦听实现
2019/04/23 Javascript
javascript实现摄像头拍照预览
2019/09/30 Javascript
详解javascript中var与ES6规范中let、const区别与用法
2020/01/11 Javascript
webpack3.0升级4.0的方法步骤
2020/04/02 Javascript
[01:01:01]完美世界DOTA2联赛循环赛 GXR vs FTD BO2第一场 10.29
2020/10/29 DOTA
[01:02:45]完美世界DOTA2联赛 LBZS vs Forest 第三场 11.07
2020/11/09 DOTA
Python输出9*9乘法表的方法
2015/05/25 Python
详谈Python高阶函数与函数装饰器(推荐)
2017/09/30 Python
opencv python 2D直方图的示例代码
2018/07/20 Python
python标记语句块使用方法总结
2019/08/05 Python
Django模板导入母版继承和自定义返回Html片段过程解析
2019/09/18 Python
python中最小二乘法详细讲解
2021/02/19 Python
俄罗斯最大的消费电子连锁零售商:Mvideo
2017/06/25 全球购物
澳大利亚当地社区首选的光学商店:1001 Optical
2019/08/24 全球购物
一道SQL面试题
2012/12/31 面试题
linux面试题参考答案(11)
2012/05/01 面试题
优秀党员转正的自我评价
2013/10/06 职场文书
运动会稿件50字
2014/02/17 职场文书
学生社团文化节开幕式主持词
2014/03/28 职场文书
项目合作意向书范本
2014/04/01 职场文书
Win11安装升级时提示“该电脑必须支持安全启动”
2022/04/19 数码科技
CSS使用Flex和Grid布局实现3D骰子
2022/08/05 HTML / CSS