<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. 【二分查找】POJ2456-Aggressive cows

    [题目大意] 有N间牛舍和M头牛,告诉你每个牛舍的位置,求出两头牛之间最小距离的最大值. [思路] 二分判断两头牛之间的最小距离d,通过贪心法进行验证. #include<iostream> ...

  2. 找出N个数中最小的k个数问题(复杂度O(N*logk))

    这是一个经典的算法题,下面给出的算法都在给定的数组基础上进行,好处时不用分配新的空间,坏处是会破坏原有的数组,可以自己分配新的空间以避免对原有数组的破坏. 思路一 先直接排序,再取排序后数据的前k个数 ...

  3. Java高级架构师（一）第36节：Nginx的反向代理模块

    理解Http正向代理和Http反向代理的区别 Proxy模块,最常用的proxy_pass, Proxy_pass 可以转发请求到其他的浏览器.  # Nginx强项在于负载.反向.动静分离 #

  4. kindeditor在Firefoxt 和 Chrome 下不能取到值的解决方法

    默认form模式提交数据的时候,在ie下用户不需要进行任何设置和调用sync函数,因为editor已经自动调用,但是在firefox和 chrome下,用户如果不手动调用sync函数,editor的数 ...

  5. HDU 4632 Palindrome subsequence （2013多校4 1001 DP）

    Palindrome subsequence Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 131072/65535 K (Java/ ...

  6. 某游戏研究之字符过滤类-WorldFilter

    所谓字符过滤器,常常用在聊天的内容,比如一连串的骂人难听的话,我们要屏蔽掉,避免造成不好的东西! 当然我作为中华天朝一个有文明有素质的人,肯定偶尔会做这样的事情啦,特别是打LOL的时候,算了不讲了,都 ...

  7. nginxtomca负载均衡

    Nginx 是一个高性能的 Web 和反向代理服务器, 它具有有很多非常优越的特性: 作为 Web 服务器:相比 Apache,Nginx 使用更少的资源,支持更多的并发连接,体现更高的效率,这点使 ...

  8. 使用免安装版本在windows上手动安装PostgreSQL

    PostgreSQL支持管理员直接手动安装数据库,给用户提供了更大的方便.     1. 在PostgreSQL官方网站上下载免安装二进制的包,名字类似于postgresql-*.*.*.*-bina ...

  9. ckeditor 绑定事件

    CKEDITOR.instances["Content"].on("instanceReady", function () { //set keyup even ...

  10. [Angular] Angular i18n Pluralization Support

    // Component: this.coursesTotal = this.course,length <div i18n>{coursesTotal, plural, =0 {No c ...