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自定义的函数
Aug 05 Javascript
使用jquery mobile做幻灯播放效果实现步骤
Jan 04 Javascript
JavaScript版TAB选项卡效果实例
Aug 16 Javascript
js实现的黑背景灰色二级导航菜单效果代码
Aug 24 Javascript
Javascript中神奇的this
Jan 20 Javascript
获取本机IP地址的实例(JavaScript / Node.js)
Nov 24 Javascript
React Native开发封装Toast与加载Loading组件示例
Sep 08 Javascript
实例讲解JavaScript预编译流程
Jan 24 Javascript
通过js给网页加上水印背景实例
Jun 17 Javascript
vue遍历对象中的数组取值示例
Nov 07 Javascript
vue prop属性传值与传引用示例
Nov 13 Javascript
vue中用 async/await 来处理异步操作
Jul 18 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
用phpmyadmin更改mysql5.0登录密码
2008/03/25 PHP
php引用传值实例详解学习
2013/11/06 PHP
php使用Jpgraph绘制柱形图的方法
2015/06/10 PHP
php简单随机字符串生成方法示例
2017/04/19 PHP
菜单效果
2006/10/14 Javascript
JavaScript中的document.referrer在各种浏览器测试结果
2014/07/18 Javascript
ajaxFileUpload.js插件支持多文件上传的方法
2014/09/02 Javascript
javascript运动效果实例总结(放大缩小、滑动淡入、滚动)
2016/01/08 Javascript
js组件SlotMachine实现图片切换效果制作抽奖系统
2016/04/17 Javascript
AngularJS实现动态编译添加到dom中的方法
2016/11/04 Javascript
Web 开发中Ajax的Session 超时处理方法
2017/01/19 Javascript
Bootstrap实现的标签页内容切换显示效果示例
2017/05/25 Javascript
js实现京东轮播图效果
2017/06/30 Javascript
React Native 真机断点调试+跨域资源加载出错问题的解决方法
2018/01/18 Javascript
selenium+java中用js来完成日期的修改
2019/10/31 Javascript
[01:03:31]DOTA2上海特级锦标赛B组资格赛#1 Alliance VS Fnatic第二局
2016/02/26 DOTA
[08:08]DOTA2-DPC中国联赛2月28日Recap集锦
2021/03/11 DOTA
python中使用urllib2获取http请求状态码的代码例子
2014/07/07 Python
在类Unix系统上开始Python3编程入门
2015/08/20 Python
Python中表达式x += y和x = x+y 的区别详解
2017/06/20 Python
python opencv人脸检测提取及保存方法
2018/08/03 Python
python实现一个简单的udp通信的示例代码
2019/02/01 Python
Python选择网卡发包及接收数据包
2019/04/04 Python
python 通过手机号识别出对应的微信性别(实例代码)
2019/12/22 Python
纯CSS3实现表单验证效果(非常不错)
2017/01/18 HTML / CSS
用CSS3来实现社交分享按钮
2014/11/11 HTML / CSS
CSS3颜色值RGBA与渐变色使用介绍
2020/03/06 HTML / CSS
HTML5中视频音频的使用详解
2017/07/07 HTML / CSS
材料加工硕士生求职信
2013/10/10 职场文书
校领导推荐信
2013/11/01 职场文书
初三家长会邀请函
2014/01/18 职场文书
网络工程专业自荐信范文
2014/03/16 职场文书
公司委托书格式
2014/08/01 职场文书
不尊敬老师检讨书范文
2014/11/19 职场文书
《所见》教学反思
2016/02/23 职场文书
分析Java中Map的遍历性能问题
2021/06/26 Java/Android