Jquery 1.42 checkbox 全选和反选代码


Posted in Javascript onMarch 27, 2010

Jquery代码

<script type="text/javascript" src="jquery-1.4.2.min.js"></script> 
<script type="text/javascript"> 
function Checked(){ //定义函数checked 
$(".chk").each(function(){ //遍历html中class为chk的复选框标签 
if($(this).attr("checked") == true){ //如果当前复选框的checked属性为true 
$(this).attr("checked",false); //将该属性改为false 
} 
else{ //如果当前复选框的checked属性为false 
$(this).attr("checked",true); //将该属性改为true 
} 
}); 
if($("#lbl").html() == "全选"){ //修改label的文本为“反选” 
$("#lbl").html("反选"); 
} 
else if($("#lbl").html() == "反选"){ //修改label的文本为“全选” 
$("#lbl").html("全选"); 
} 
} 
$(document).ready(function(){ //为label添加click事件执行函数checked 
$("#lbl").bind("click",Checked); 
}) 
</script>

Html代码
<label id="lbl">全选</label> 
<table> 
<tr> 
<td> 
<input type="checkbox" class="chk" /> 
</td> 
</tr> 
<tr> 
<td> 
<input type="checkbox" class="chk" /> 
</td> 
</tr> 
<tr> 
<td> 
<input type="checkbox" class="chk" /> 
</td> 
</tr> 
<tr> 
<td> 
<input type="checkbox" class="chk" /> 
</td> 
</tr> 
<tr> 
<td> 
<input type="checkbox" class="chk" /> 
</td> 
</tr> 
</table>

O(∩_∩)O每天进步一点点O(∩_∩)O 该BLOG供个人记录学习笔记,如有错误欢迎指出!
Javascript 相关文章推荐
调用DOM对象的focus使文本框获得焦点
Feb 19 Javascript
父页面显示遮罩层弹出半透明状态的dialog
Mar 04 Javascript
AngularJS入门教程之迭代器过滤详解
Aug 18 Javascript
bootstrap模态框实现拖拽效果
Dec 14 Javascript
javascript构造函数以及原型对象的理解
Jan 13 Javascript
JavaScript中数组Array.sort()排序方法详解
Mar 01 Javascript
js处理包含中文的字符串实例
Oct 11 Javascript
JS实现分页浏览横向图片(类轮播)实例代码
Nov 06 Javascript
Angular4.x通过路由守卫进行路由重定向实现根据条件跳转到相应的页面(推荐)
May 10 Javascript
Vue强制组件重新渲染的方法讨论
Feb 03 Javascript
vue组件的路由高亮问题解决方法
May 11 Vue.js
Vue Element UI自定义描述列表组件
May 18 Vue.js
网络图片延迟加载实现代码 超越jquery控件
Mar 27 #Javascript
JQuery的一些小应用收集
Mar 27 #Javascript
Visual Studio中的jQuery智能提示设置方法
Mar 27 #Javascript
Jquery 滑入滑出效果实现代码
Mar 27 #Javascript
Jquery ajax不能解析json对象,报Invalid JSON错误的原因和解决方法
Mar 27 #Javascript
javascript sudoku 数独智力游戏生成代码
Mar 27 #Javascript
Javascript 函数中的参数使用分析
Mar 27 #Javascript
You might like
用PHP 4.2书写安全的脚本
2006/10/09 PHP
php利用反射实现插件机制的方法
2015/03/14 PHP
Laravel配合jwt使用的方法实例
2020/10/25 PHP
Javascript YUI 读码日记之 YAHOO.util.Dom - Part.3
2008/03/22 Javascript
js当一个变量为函数时 应该注意的一点细节小结
2011/12/29 Javascript
jquery解决图片路径不存在执行替换路径
2013/02/06 Javascript
JS实现金额转换(将输入的阿拉伯数字)转换成中文的实现代码
2013/09/30 Javascript
event对象获取方法总结在google浏览器下测试
2013/11/03 Javascript
jQuery trigger()方法用法介绍
2015/01/13 Javascript
javascript设置页面背景色及背景图片的方法
2015/12/29 Javascript
jQuery实现Select左右复制移动内容
2016/08/05 Javascript
Node.js之网络通讯模块实现浅析
2017/04/01 Javascript
vue实现pdf导出解决生成canvas模糊等问题(推荐)
2018/10/18 Javascript
layui 对弹窗 form表单赋值的实现方法
2019/09/04 Javascript
使用layui 的layedit定义自己的toolbar方法
2019/09/18 Javascript
element实现合并单元格通用方法
2019/11/13 Javascript
微信小程序之导航滑块视图容器功能的实现代码(简单两步)
2020/06/19 Javascript
wepy--用vantUI 实现上弹列表并选择相应的值操作
2020/11/03 Javascript
连接Python程序与MySQL的教程
2015/04/29 Python
Python cookbook(数据结构与算法)从字典中提取子集的方法示例
2018/03/22 Python
对python创建及引用动态变量名的示例讲解
2018/11/10 Python
Kali Linux安装ipython2 和 ipython3的方法
2019/07/11 Python
HTML5之HTML元素扩展(上)—新增加的元素及使用概述
2013/01/31 HTML / CSS
HTML5中的网络存储实现方式
2020/04/28 HTML / CSS
Raleigh兰令自行车美国官网:英国凤头牌自行车
2018/01/08 全球购物
世界上最全面的草药补充剂和顶级品牌维生素网站:HerbsPro
2019/01/20 全球购物
英语专业个人求职自荐信
2013/09/21 职场文书
新闻专业大学生找工作的自我评价
2013/10/30 职场文书
会议接待欢迎词
2014/01/12 职场文书
房屋租房协议书范本
2014/12/04 职场文书
检讨书范文
2015/01/27 职场文书
报名委托书
2015/01/29 职场文书
2016年小学教师师德承诺书
2016/03/25 职场文书
文书工作总结(范文)
2019/07/11 职场文书
html form表单基础入门案例讲解
2021/07/15 HTML / CSS
dubbo服务整合zipkin详解
2021/07/26 Java/Android