<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. CentOS 5/6安装后的必备设置(转)

    说明:转自各大优化方案,相当于是一个大杂烩,后续会搞成是一个Shell脚本简化操作. 1.修改ip地址.网关.主机名.DNS等 (这个操作可以使用Setup工具进行配置,但不建议使用,封装太多,没有配 ...

  2. NHibernate 之数据操作 (第五篇)

    数据操作,在这里主要介绍INSERT.UPDATE.DELETE.我们在使用NHibernate的时候,如果只是查询数据,不需要改变数据库的值,那么是不需要提交或者回滚到数据库的. 一.INSERT ...

  3. IIS配置Asp.net时,出现“未能加载文件或程序集“System.Web.Extensions.Design, Version=1.0.61025.0”

    如果出现未能加载文件或程序集“System.Web.Extensions.Design, Version=1.0.61025.0, 主要是没有安装.net framwork 3.5,安装一下就行了. ...

  4. Inno Setup入门(十九)——Inno Setup类参考(5)

    单选按钮 单选按钮在安装中也很常见,例如同一个程序可以选择安装不同的性质的功能,例如选择32位或者64位等,两者是排他性的,因此可以通过单选按钮(RadioButton)来实现,在同一个容器中放置的单 ...

  5. springBoot单元测试-基础单元测试

    1)在pom文件中加入junit支持 <!-- spring-boot-starter-test 单元测试 --> <dependency> <groupId>or ...

  6. 剖析ASP.NET Core(Part 3)- UseMvc(译)

    原文:https://www.stevejgordon.co.uk/asp-net-core-anatomy-part-3-addmvc 发布于:2017年4月环境:ASP.NET Core 1.1 ...

  7. web.xml文件的作用及基本配置

    Java的web工程中的web.xml文件有什么作用呢?它是每个web工程都必须的吗? 一个web中完全可以没有web.xml文件,也就是说,web.xml文件并不是web工程必须的. 那什么时候需要 ...

  8. tensorflow c++ API加载.pb模型文件并预测图片

    tensorflow  python创建模型,训练模型,得到.pb模型文件后,用c++ api进行预测 #include <iostream> #include <map> # ...

  9. C# http Post 方法

    摘自: http://geekswithblogs.net/rakker/archive/2006/04/21/76044.aspx Http Post in C# Searched out on t ...

  10. java 图片文字识别 ocr

    最近在开发的时候需要识别图片中的一些文字,网上找了相关资料之后,发现google有一个离线的工具,以下为java使用的demo 在此之前,使用这个工具需要在本地安装OCR工具: 下面一个是一定要安装的 ...