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 相关文章推荐
页面装载js及性能分析方法介绍
Mar 21 Javascript
angularjs中的单元测试实例
Dec 06 Javascript
JavaScript+html5 canvas制作的百花齐放效果完整实例
Jan 26 Javascript
分享我对JS插件开发的一些感想和心得
Feb 04 Javascript
Vue2.0如何发布项目实战
Jul 27 Javascript
vue自定义过滤器创建和使用方法详解
Nov 06 Javascript
Node.js使用Express.Router的方法
Nov 14 Javascript
使用post方法实现json往返传输数据的方法
Mar 30 Javascript
Windows上node.js的多版本管理工具用法实例分析
Nov 06 Javascript
搭建Vue从Vue-cli到router路由护卫的实现
Nov 14 Javascript
Vue 实现分页与输入框关键字筛选功能
Jan 02 Javascript
详解elementUI中input框无法输入的问题
Apr 27 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中的stdClass类
2014/04/18 PHP
Smarty变量调节器失效的解决办法
2014/08/20 PHP
PHP文件上传之多文件上传的实现思路
2016/01/27 PHP
PHP面向对象五大原则之依赖倒置原则(DIP)详解
2018/04/08 PHP
JavaScript delete 属性的使用
2009/10/08 Javascript
WEB页子窗口(showModalDialog和showModelessDialog)使用说明
2009/10/25 Javascript
利用jQuery简单实现产品展示图片左右滚动功能(示例代码)
2014/01/02 Javascript
使用js操作css实现js改变背景图片示例
2014/03/10 Javascript
JavaScript去除数组里重复值的方法
2015/07/13 Javascript
js实现三张图(文)片一起切换的banner焦点图
2015/08/25 Javascript
动态加载js、css的简单实现代码
2016/05/26 Javascript
JS控制FileUpload的上传文件类型实例代码
2016/10/07 Javascript
Jquery Easyui对话框组件Dialog使用详解(14)
2016/12/19 Javascript
JS中SetTimeout和SetInterval使用初探
2017/03/23 Javascript
AngulaJS路由 ui-router 传参实例
2017/04/28 Javascript
BootStrap 获得轮播中的索引和当前活动的焦点对象
2017/05/11 Javascript
Vue.js单向绑定和双向绑定实例分析
2018/08/14 Javascript
webpack4+react多页面架构的实现
2018/10/25 Javascript
[28:48]《真视界》- 2017年国际邀请赛
2017/09/27 DOTA
python基于右递归解决八皇后问题的方法
2015/05/25 Python
Python cx_freeze打包工具处理问题思路及解决办法
2016/02/13 Python
使用python实现tcp自动重连
2017/07/02 Python
基于python的字节编译详解
2017/09/20 Python
详解python使用Nginx和uWSGI来运行Python应用
2018/01/09 Python
numpy.linspace 生成等差数组的方法
2018/07/02 Python
python数据结构之线性表的顺序存储结构
2018/09/28 Python
Python进程池Pool应用实例分析
2019/11/27 Python
python 绘制场景热力图的示例
2020/09/23 Python
Lands’ End官网:经典的美国生活方式品牌
2016/08/14 全球购物
阿拉伯世界最大的电子商务网站:Souq沙特阿拉伯
2016/10/28 全球购物
MAC彩妆英国官网:M·A·C UK
2018/05/30 全球购物
沃尔玛旗下墨西哥超市:Bodega Aurrera
2020/11/13 全球购物
学校运动会霸气口号
2014/06/07 职场文书
个人向公司借款协议书
2014/10/09 职场文书
陈斌强事迹观后感
2015/06/17 职场文书
公司开业的祝贺语大全(60条)
2019/07/05 职场文书