jQuery 的全选(全非选)即取得被选中的值使用介绍


Posted in Javascript onNovember 12, 2013

页面代码

<body> 
<div> 
<input id="checkall" type="checkbox" value="天" />全部<br/> 
<div id="con"> 
<input type="checkbox" name="checkbox" value="天" />天 
<input type="checkbox" name="checkbox" value="空" />空 
<input type="checkbox" name="checkbox" value="飞" />飞 
<input type="checkbox" name="checkbox" value="来" />来 
<input type="checkbox" name="checkbox" value="五" />五 
<input type="checkbox" name="checkbox" value="个" />个 
<input type="checkbox" name="checkbox" value="字" />字 
<input type="checkbox" name="checkbox" value="这" />这 
<input type="checkbox" name="checkbox" value="都" />都 
<input type="checkbox" name="checkbox" value="不" />不 
<input type="checkbox" name="checkbox" value="算" />算 
<input type="checkbox" name="checkbox" value="事" />事</div> 
</div> 
<script src="Scripts/jquery-1.4.1.js" language="javascript"></script> 
<script src="JqueryAll.js" language="javascript"></script> 
</body>

js中的代码
/*js部分 
* 绑定批量选定/非选 
* 例子 
*/ $(function () { 
$("#checkall").click(function () { 
var stu = $(this).attr("checked"); 
checkAll(stu); 
}) 
$("input[name='checkbox']").click(function () { 
uncheckAll(); 
}) 
}) 
function checkAll(status) { 
$("input[name='checkbox']").each(function () { 
$(this).attr("checked"); 
$(this).attr("checked", status); 
}) 
} 
function uncheckAll() { 
alert($("input[name='checkbox']:checked").length); 
if ($("input[name='checkbox']:checked").length == $("input[name='checkbox']").length) { 
$("#checkall").attr("checked",true); 
} 
else { 
$("#checkall").attr("checked", false); 
} 
}
Javascript 相关文章推荐
弹出层之1:JQuery.Boxy (一) 使用介绍
Oct 06 Javascript
jQuery1.9.1针对checkbox的调整方法(prop)
May 01 Javascript
javascript封装简单实现方法
Aug 11 Javascript
js实现div模拟模态对话框展现URL内容
May 27 Javascript
Vue指令的钩子函数使用方法
Mar 20 Javascript
JavaScript实现简单的四则运算计算器完整实例
Apr 28 Javascript
微信小程序promsie.all和promise顺序执行
Oct 27 Javascript
angularjs使用gulp-uglify压缩后执行报错的解决方法
Mar 07 Javascript
微信小程序wx.uploadfile 本地文件转base64的实现代码
Jun 28 Javascript
微信小程序中的上拉、下拉菜单功能
Mar 13 Javascript
关于angular引入ng-zorro的问题浅析
Sep 09 Javascript
js+css3实现简单时钟特效
Sep 13 Javascript
jquery 模板的应用示例
Nov 12 #Javascript
jQuery 无刷新分页实例代码
Nov 12 #Javascript
JS图片切换的具体方法(带缩略图版)
Nov 12 #Javascript
JS实现遮罩层效果的简单实例
Nov 12 #Javascript
javascript静态页面传值的三种方法分享
Nov 12 #Javascript
javascript的渐进增强与平稳退化浅谈
Nov 12 #Javascript
JavaScrip实现PHP print_r的数功能(三种方法)
Nov 12 #Javascript
You might like
php遍历文件夹所有文件子文件夹函数代码
2013/11/27 PHP
Laravel5.5新特性之友好报错以及展示详解
2017/08/13 PHP
jQuery EasyUI API 中文文档 - MenuButton菜单按钮使用介绍
2011/10/06 Javascript
Javascript表格翻页效果的具体实现
2013/10/05 Javascript
JS实现自适应高度表单文本框的方法
2015/02/25 Javascript
jQuery使用模式窗口实现在主页面和子页面中互相传值的方法
2016/03/01 Javascript
AngularJs 60分钟入门基础教程
2016/04/03 Javascript
js利用appendChild对标签进行排序的实现方法
2016/10/16 Javascript
Easyui Tree获取当前选择节点的所有顶级父节点
2017/02/14 Javascript
JavaScript实现经纬度转换成地址功能
2017/03/28 Javascript
使用 NodeJS+Express 开发服务端的简单介绍
2017/04/07 NodeJs
用react-redux实现react组件之间数据共享的方法
2018/06/08 Javascript
vue2中使用sass并配置全局的sass样式变量的方法
2018/09/04 Javascript
微信小程序授权登陆及每次检查是否授权实例代码
2019/09/18 Javascript
纯JS实现五子棋游戏
2020/05/28 Javascript
[00:32]2018DOTA2亚洲邀请赛Mineski出场
2018/04/04 DOTA
Python字符串转换成浮点数函数分享
2015/07/24 Python
python制作爬虫爬取京东商品评论教程
2016/12/16 Python
python删除某个字符
2018/03/19 Python
利用Pycharm断点调试Python程序的方法
2018/11/29 Python
python中pytest收集用例规则与运行指定用例详解
2019/06/27 Python
Python3爬虫关于识别点触点选验证码的实例讲解
2020/07/30 Python
用纯CSS3实现网页中常见的小箭头
2017/10/16 HTML / CSS
浅谈html5增强的页面元素
2016/06/14 HTML / CSS
亚历山大·王官网:Alexander Wang
2017/06/23 全球购物
酒店管理专业毕业生推荐信
2013/11/10 职场文书
机械设计专业应届生求职信
2013/11/21 职场文书
自我推荐书
2013/12/04 职场文书
大学生自我评价范文
2015/03/03 职场文书
小学班主任工作总结2015
2015/04/07 职场文书
践行三严三实心得体会(2016推荐篇)
2016/01/06 职场文书
2016思想纪律作风整顿心得体会
2016/01/23 职场文书
2016医师资格考试考生诚信考试承诺书
2016/03/25 职场文书
2019新员工心得体会
2019/06/25 职场文书
2019终止劳动合同协议书最新范本!
2019/07/09 职场文书
php访问对象中的成员的实例方法
2021/11/17 PHP