<html>
<head></head>
<body>
<div id="places">
<input type="checkbox" name="chx" value="1" onclick="_check_status(this)"/>香港
<input type="checkbox" name="chx" value="2" onclick="_check_status(this)"/>澳门
<input type="checkbox" name="chx" value="3" onclick="_check_status(this)"/>深圳
<input type="checkbox" name="chx" value="4" onclick="_check_status(this)"/>台北
<input type="checkbox" name="chx" value="5" onclick="_check_status(this)"/>乌镇
</div> <div id="allplaces">
<input type="checkbox" id="checkall" name="chx" value="0" onclick="_check_all(this)"/>全选
</div>
</body>
<script>
//点击“全选”, 所有地方都选上
function _check_all(obj)
{
var nodes = document.getElementById("places").childNodes;
if(obj.checked)
{
for (var i=0; i < nodes.length; i++)
{
if(nodes[i].type == "checkbox")
{
nodes[i].checked = true;
}
}
}
else
{
for (var i=0; i < nodes.length; i++)
{
if(nodes[i].type == "checkbox")
{
nodes[i].checked = false;
}
}
}
} //每一个checkbox的状态校验
function _check_status(obj)
{
var nodes = document.getElementById("places").childNodes;
if(obj.checked)
{
for (var i=0; i < nodes.length; i++)
{
if((nodes[i].type == "checkbox") && !nodes[i].checked)
{
document.getElementById("checkall").checked = false;
return;
}
} document.getElementById("checkall").checked = true;
}
else
{
document.getElementById("checkall").checked = false;
}
} </script>
</html>

checkbox 全选操作的更多相关文章

  1. jquery checkbox全选,全不选,反选方法,jquery checkbox全选只能操作一次

    jquery checkbox全选,全不选,反选方法, jquery checkbox全选只能操作一次, jquery checkbox全选只有第一次成功 >>>>>&g ...

  2. JS实战 · 复选框全选操作

    思路: 1.获取被选中checkbox,通过checked属性的状态完成: 2.获取被选中的checkbox的value值: 3.求所有value的和sum: 4.定义span区域存储和sum:   ...

  3. checkbox 全选,反选 ,全不选

    在表格或者列表中经常会遇到要全选或者反选等交互,今天总结了一下代码,保留着以后直接拿来用 原理: 1. 全选:当全选checkbox被点击(不管点击之前是什么状态)后,获取其checked状态.然后对 ...

  4. GridView CheckBox 全选

    GridView CheckBox 全选 <script type="text/javascript"> $(function () { $("#allChe ...

  5. Jquery学习之路(一) 实现checkbox全选方法

    昨天早上有写到怎么利用Jquery实现全选 根据大家的意见对程序中一些写法不好的地方进行了修改,也是本人水平有限,存在各种考虑不到的地方. 文章最后我提出了一个问题,要写一个通用的方法来调用,于是就有 ...

  6. 第十六篇 JS实现全选操作

    JS实现全选   嗨,同学们好,老师这里是专门教同学解决一些针对性的问题,所以说综合起来,就要靠同学自己了. 这节课我们学一个很实用的东西,全选操作!比如淘宝这种商城对吧,我的购物车,我要全选购买,或 ...

  7. TreeView checkbox 全选

    在使用TreeView 控件 ,进行权限管理的时候,需要使用 checkbox全选. 勾选父节点,子节点全部选中.取消父节点,子节点不选中. 勾选子节点,父节点也选中. 以下是在使用的例子: < ...

  8. JS checkbox 全选 全不选

    /* JS checkbox 全选 全不选 Html中checkbox: <input type="checkbox" name="cbx" value= ...

  9. checkbox全选,反选,取消选择 jquery

    checkbox全选,反选,取消选择 jquery. //checkbox全部选择 $(":checkbox[name='osfipin']").each(function(){ ...

  10. js初学—实现checkbox全选功能

    布局如下: <p ><input type="checkbox" id="che1"/>全选</p><div id=& ...

随机推荐

  1. 【计算几何】【极角排序】【二分】Petrozavodsk Summer Training Camp 2016 Day 6: Warsaw U Contest, XVI Open Cup Onsite, Sunday, August 28, 2016 Problem J. Triangles

    平面上给你n(不超过2000)个点,问你能构成多少个面积在[A,B]之间的Rt三角形. 枚举每个点作为直角顶点,对其他点极角排序,同方向的按长度排序,然后依次枚举每个向量,与其对应的另一条直角边是单调 ...

  2. python基础之生成器,三元表达式,列表生产式

    生成器 1.什么是生成器? 在函数内但凡出现yield关键字,再调用函数就不会执行函数体代码,会返回一个值,该值称为生成器. 生成器的本质就是迭代器. 2.为什么要用生成器? 生成器是一种自定义迭代器 ...

  3. 5月学习总结(Ant-Design,mustache,require.js,grunt)

    一.Ant-Design学习 因为Ant-Design是基于React实现的,之前自己也学过一段时间的React,对React还是相对比较熟悉的,在学习Ant-Design也还不算吃力. 最开始是从源 ...

  4. 微信小程序官方文档

    开发手册: https://developers.weixin.qq.com/miniprogram/dev/api/network-file.html 管理后台: https://mp.weixin ...

  5. Composer与laravel安装

    首先,要知道Composer是什么? Composer是PHP中用来管理依赖(dependency)关系的工具.你可以在自己的项目中声明所依赖的外部工具库(libraries),Composer会帮你 ...

  6. iOS -- DES算法

    算法步骤: DES算法把64位的明文输入块变为64位的密文输出块,它所使用的密钥也是64位(实际用到了56位,第8.16.24.32.40.48.56.64位是校验位, 使得每个密钥都有奇数个1),其 ...

  7. java反序列号漏洞分析资料汇总,待研究

    https://blog.chaitin.cn/2015-11-11_java_unserialize_rce/ http://blog.nsfocus.net/?s=fastjson http:// ...

  8. Linux环境下搭建MYSQL数据库指令详情

    一.mysql数据库的安装 确保安装gcc(开发工具) #groupadd mysql #useradd -g mysql mysql #cd /usr/local # tar -zxvf mysql ...

  9. 【转】dependency injection 的例子

    Dependency Injection in PHP. Create your own DI container. / blog / PHP By my opinion one of the big ...

  10. Android - Animation(二)

    Android - Animation(一) 一文总结了Android中的补间动画(View Animation/Tween Animation)和帧动画(Drawable Animation/Fra ...