js实现checkbox全选与反选
<script type="text/javascript" language="javascript">
function checkAll(id,name)//此方法用来全选和全消复选框
{ var items=document.getElementsByName(name);
var itemall=document.getElementById(id);
for(var i=0;i<items.length;i++){
items[i].checked=itemall.checked;
}
}
function resAll(id,name){
var items=document.getElementsByName(name);
var itemall=document.getElementById(id);
var ite=0; //此变量用来记录当前选中的checkbox的个数
for(var i=0;i<items.length;i++){
//获得当前选中的checkbox的数量
if(items[i].checked){
ite++;
}
}
//如果当前选中的数量为有一个没有选中,并且全选框是选中状态
//则将全选框的状态变为不选择
if(ite==items.length-1&&itemall.checked){
itemall.checked=false;
}
/*---
//这个适用于你想把子选项完全去掉才将全选的效果去掉
if(ite==0&&itemall.checked){
itemall.checked=false;
}
---*/
//如果当前选中的数量为零并且全选框是未选中状态
//则将全选框的状态变为选择
if(ite==items.length&&!itemall.checked){
itemall.checked=true;
}
}
</script>
html部分
广告位位置: 全部:<input type="checkbox" id="checkall" onclick="checkAll('checkall','position[]')">
首页:<input type="checkbox" name="position[]" value="index" onclick="resAll('checkall','position[]')">
分类页:<input type="checkbox" name="position[]" value="category" onclick="resAll('checkall','position[]')">
详情页:<input type="checkbox" name="position[]" value="detail" onclick="resAll('checkall','position[]')">
播放页: <input type="checkbox" name="position[]" value="play" onclick="resAll('checkall','position[]')"><br />
终端: 全部:<input type="checkbox" id="check" onclick="checkAll('check','terminal[]')">
网络:<input type="checkbox" name="terminal[]" value="net" onclick="resAll('check','terminal[]')">
机顶盒:<input type="checkbox" name="terminal[]" value="stb" onclick="resAll('check','terminal[]')">
移动:<input type="checkbox" name="terminal[]" value="mobile" onclick="resAll('check','terminal[]')">
js实现checkbox全选与反选的更多相关文章
- js解决checkbox全选和反选的问题
function SelectAll() { var checkboxs=document.getElementsByName("chk_list"); for (var i=0; ...
- checkbox全选,反选,取消选择 jquery
checkbox全选,反选,取消选择 jquery. //checkbox全部选择 $(":checkbox[name='osfipin']").each(function(){ ...
- checkbox全选与反选
用原生js跟jquery实现checkbox全选反选的一个例子 原生js: <!DOCTYPE html> <html lang="en"> <hea ...
- angularjs实现 checkbox全选、反选的思考
之前做了一周的打酱油测试,其实感觉其实测试也是上辈子折翼的天使. 好长时间没写代码,感觉好多都不会了. 感谢这周没有单休,我能看熬夜看奥运了.我能有时间出去看个电影,我能有时间出去逛个商城,我能有时间 ...
- Checkbox 全选、反选
1.全选.反选 <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></t ...
- vue中的checkbox全选和反选
前几天有个博客园的朋友问小颖,小颖之前写的vue2.0在table中实现全选和反选 .Vue.js实现checkbox的全选和反选,为什么他将里面的js复制下来,但是实现不了全选和反选.小颖当时看他 ...
- checkbox 全选,反选 ,全不选
在表格或者列表中经常会遇到要全选或者反选等交互,今天总结了一下代码,保留着以后直接拿来用 原理: 1. 全选:当全选checkbox被点击(不管点击之前是什么状态)后,获取其checked状态.然后对 ...
- 练习-checkbox 全选 ,反选, 单选,以及取值
1.方法1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w ...
- jquery一键控制checkbox全选,反选,全不选。
jquery attr()方法获取标签的 checked 会有问题,所以用了 prop() 方法. Hml的checkbox没有加name,只用了 div 嵌套. 如有更好的方法,望指点!! //全选 ...
随机推荐
- smarty模板引擎中section循环loop与total的区别
在smarty模板引擎的section循环中 $data=[101,102,103,105,104]; section的两个属性total与loop {section foo $data start= ...
- destoon实现资讯信息前面调用它所属分类的方法
有时候我们需要在一些信息前面添加他所属的分类,让他显示出来,本文介绍的方法虽然有些不具有通用性,但是可以实现这一效果,代码如下,供大家参考: <!--{php null=tag("mo ...
- 继续畅通工程--hdu1879
继续畅通工程 Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others)Total Subm ...
- [C入门 - 游戏编程系列] 贪吃蛇篇(六) - 蛇实现
这一篇是关于设置蛇的属性的,接上一篇(五). 设置蛇的速度,很简单,只要不是负数就行了. void SNK_SetSnakeSpeed(Snake *snake, int speed) { ) sna ...
- 《转》ACTIONBAR-PULLTOREFRESHLIBS+沉浸式在部分手机上的布局错乱,目前知道的三星系统(TouchWiz)
转载:http://www.cnblogs.com/wubingshenyin/p/4413672.html(原文连接) 前段时间看见ActionBar-PullToRefreshLibs用来刷新很好 ...
- 在开启bin-log日志下Mysql报错
This function has none of DETERMINISTIC, NO SQL解决办法 创建存储过程时 出错信息: ERROR 1418 (HY000): This function ...
- 使用片上XRAM需要进行的初始化
现在,流行的51单片机大多把on-chip expanded RAM(以下简称XRAM)作为基本配置,容量有些差别.厂商在给出芯片特性时,往往把XRAM和标准52芯片的256字节内部RAM加在一起统称 ...
- 《Programming WPF》翻译 第9章 5.默认可视化
原文:<Programming WPF>翻译 第9章 5.默认可视化 虽然为控件提供一个自定义外观的能力是有用的,开发者应该能够使用一个控件而不用必须提供自定义可视化.这个控件应该正好工作 ...
- 【转】Linux下tar.xz结尾的文件的解压方法--不错
原文网址:http://blog.csdn.net/silvervi/article/details/6325698 今天尝试编译内核,下载到了一份tar.xz结尾的压缩文件,网上解决方法比较少,不过 ...
- 自定义ScrollViewer的Touch事件--触摸上下移动ScrollViewer滚动到指定位置
double mPointY;//触摸点的Y坐标 double mOffsetY;//滚动条当前位置 bool mIsTouch = false;//是否触摸 //触摸事件 private void ...