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 相关文章推荐
统计jQuery中各字符串出现次数的工具
May 03 Javascript
JavaScript执行顺序详细介绍
Dec 04 Javascript
Javascript基础教程之数据类型 (布尔型 Boolean)
Jan 18 Javascript
原生javascript实现addClass,removeClass,hasClass函数
Feb 25 Javascript
Bootstrap Validator 表单验证
Jul 25 Javascript
js实现非常棒的弹出div
Oct 06 Javascript
Jquery Easyui分割按钮组件SplitButton使用详解(17)
Dec 18 Javascript
基于BootStrap的前端分页带省略号和上下页效果
May 18 Javascript
jQuery获取单选按钮radio选中值与去除所有radio选中状态的方法
May 20 jQuery
JS查找数组中重复元素的方法详解
Jun 14 Javascript
Node.js利用js-xlsx处理Excel文件的方法详解
Jul 05 Javascript
基于JavaScript实现多级菜单效果
Jul 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
PHP简单获取上月、本月、近15天、近30天的方法示例
2017/07/03 PHP
PHP使用file_get_contents发送http请求功能简单示例
2018/04/29 PHP
文本加密解密
2006/06/23 Javascript
jquery乱码与contentType属性设置问题解决方案
2013/01/07 Javascript
THREE.JS入门教程(1)THREE.JS使用前了解
2013/01/24 Javascript
jQuery Ajax异步处理Json数据详解
2013/11/05 Javascript
JavaScript Serializer序列化时间处理示例
2014/07/31 Javascript
JavaScript函数使用的基本教程
2015/06/04 Javascript
jquery使整个div区域可以点击的方法
2015/06/24 Javascript
JavaScript模块化开发之SeaJS
2015/12/13 Javascript
老司机带你解读jQuery插件开发流程
2016/05/16 Javascript
微信js-sdk分享功能接口常用逻辑封装示例
2016/10/13 Javascript
JS短信验证码倒计时功能的实现(没有验证码,只有倒计时)
2016/10/27 Javascript
通过jsonp获取json数据实现AJAX跨域请求
2017/01/22 Javascript
基于vue实现分页效果
2017/11/06 Javascript
Vue通过URL传参如何控制全局console.log的开关详解
2017/12/07 Javascript
详解如何在React组件“外”使用父组件的Props
2018/01/12 Javascript
JS实现的集合去重,交集,并集,差集功能示例
2018/03/13 Javascript
微信小程序实现自定义picker选择器弹窗内容
2020/05/26 Javascript
JS中使用cavas截图网页并解决跨域及模糊问题
2018/11/13 Javascript
spring+angular实现导出excel的实现代码
2019/02/27 Javascript
深入理解Vue keep-alive及实践总结
2019/08/21 Javascript
[01:00:30]TFT vs VGJ.T Supermajor 败者组 BO3 第一场 6.5
2018/06/06 DOTA
用Python制作在地图上模拟瘟疫扩散的Gif图
2015/03/31 Python
python通过自定义isnumber函数判断字符串是否为数字的方法
2015/04/23 Python
python后端接收前端回传的文件方法
2019/01/02 Python
python数据库操作mysql:pymysql、sqlalchemy常见用法详解
2020/03/30 Python
Python接口测试结果集实现封装比较
2020/05/01 Python
html5启动原生APP总结
2020/07/03 HTML / CSS
意大利奢华内衣制造商:Cosabella
2017/08/29 全球购物
Bose法国官网:购买耳机、扬声器、家庭影院、专业音响
2017/12/21 全球购物
C#中类(class)与结构(struct)的异同
2013/11/03 面试题
小学生安全演讲稿
2014/04/25 职场文书
大学生档案自我鉴定(2篇)
2014/10/14 职场文书
好员工观后感
2015/06/17 职场文书
淡雅古典唯美少女娇媚宁静迷人写真
2022/03/21 杂记