欢迎来到代码驿站!

jquery

当前位置:首页 > 网页前端 > jquery

Jquery 1.42 checkbox 全选和反选代码

时间:2021-05-31 08:24:06|栏目:jquery|点击:

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供个人记录学习笔记,如有错误欢迎指出!

上一篇:jQuery学习笔记之jQuery.fn.init()的参数分析

栏    目:jquery

下一篇:EasyUI学习之DataGird分页显示数据

本文标题:Jquery 1.42 checkbox 全选和反选代码

本文地址:http://www.codeinn.net/misctech/132272.html

推荐教程

广告投放 | 联系我们 | 版权申明

重要申明:本站所有的文章、图片、评论等,均由网友发表或上传并维护或收集自网络,属个人行为,与本站立场无关。

如果侵犯了您的权利,请与我们联系,我们将在24小时内进行处理、任何非本站因素导致的法律后果,本站均不负任何责任。

联系QQ:914707363 | 邮箱:codeinn#126.com(#换成@)

Copyright © 2020 代码驿站 版权所有