当前位置：首页 > 资讯 > 技术文档

jQuery CheckBox全选、全不选实现代码小结

时间：2022-08-22 17:05 编辑：来源：阅读：
扫一扫，手机访问

摘要：jQuery CheckBox全选、全不选实现代码小结

直接上代码。

[Ctrl+A 全选注:[url=http://www.1sucai.cn/article/23421.htm]如需引入外部Js需刷新才能执行[/url]]

下面的代码比较全，是基于js的控制原理实现

<script src="http://img.jb51.net/jslib/jquery/jquery14.js"></script>

<script type="text/javascript">

//全选

function CheckedAll(){

$(':checkbox').attr('checked','checked');

}

//全不选

function CheckedNo(){

$(':checkbox').attr('checked','');

}

//反选

function CheckedRev(){

var arr = $(':checkbox');

for(var i=0;i<arr.length;i++){

arr[i].checked = ! arr[i].checked;

}

}

</script>

<body>

<div>

<input id="CheckAll" type="checkbox" />

<input name="subBox" type="checkbox" />

<input name="subBox" type="checkbox" />

<input name="subBox" type="checkbox" />

<input name="subBox" type="checkbox" />

</div>

<input type="button" name="btnCheckedAll" value="全　选" onclick="javascript:CheckedAll();" />

<input type="button" name="btnCheckedNo" value="全不选" onclick="javascript:CheckedNo();" />

<input type="button" name="btnCheckedRev" value="反　选" onclick="javascript:CheckedRev();" />

</body>

全部评论(0)

上一篇：Knockout text绑定DOM的使用方法
下一篇：JavaScript中的substr()方法使用详解

资讯排行榜
更多>>