<body>

 <input id="btn1" type="button" value="全选" /><br>

 <input id="btn2" type="button" value="不选" /><br>

 <input id="btn3" type="button" value="反选" /><br>

 <div id="div1">

     <input type="checkbox" /><br>

     <input type="checkbox" /><br>

     <input type="checkbox" /><br>

     <input type="checkbox" /><br>

     <input type="checkbox" /><br>

     <input type="checkbox" /><br>

     <input type="checkbox" /><br>

     <input type="checkbox" /><br>

     <input type="checkbox" /><br>

     <input type="checkbox" /><br>

     <input type="checkbox" /><br>

     <input type="checkbox" /><br>

     <input type="checkbox" /><br>

     <input type="checkbox" /><br>

     <input type="checkbox" /><br>

     <input type="checkbox" /><br>

     <input type="checkbox" /><br>

 </div>

 </body>
 <script>

  window.onload=function ()

  {

      var oBtn1=document.getElementById('btn1');

      var oBtn2=document.getElementById('btn2');

      var oBtn3=document.getElementById('btn3');

      var oDiv=document.getElementById('div1');

      var aCh=oDiv.getElementsByTagName('input');

      oBtn1.onclick=function ()

      {

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

           {

               aCh[i].checked=true;

               }  

      }

      oBtn2.onclick=function ()

      {

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

           {

               aCh[i].checked=false;

               }  

      }

       oBtn3.onclick=function ()

      {

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

           {

               if(aCh[i].checked==true)

               {

                    aCh[i].checked=false;

                   }

                   else

                   {

                         aCh[i].checked=true;

                       }

               } 

      }

 }

 </script>

闲扯 Javascript 02 全选、不选、反选的更多相关文章

  1. 表单javascript checkbox全选 反选 全不选

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http ...

  2. JavaScript 实现全选 / 反选功能

    JavaScript 实现全选 / 反选功能 版权声明:未经授权,内容严禁转载! 构建主体界面 编写 HTML 代码 和 CSS 代码,设计主题界面 <style> #user { wid ...

  3. JavaScript小例子：复选框全选

    JavaScript小例子:复选框全选 这只是一个小例子,很简单,但是这个功能还是很常用的: 实现后效果如图: JavaScript代码: <script type="text/jav ...

  4. jQuery/javascript实现全选全不选

    <html> <head> <meta charset="utf-8"> <title>Checkbox的练习</title& ...

  5. Javascript实现全选按钮

    Javascript实现全选按钮 效果:有全选选项框和单个选项框,选择全选框,所有的的选择都打上的钩,取消全选钩所有的都去掉了钩,如果取消其中某一个的钩,那么全选的钩也取消,反之全选所有的选项,那么全 ...

  6. 【三石jQuery视频教程】02.创建 FontAwesome 复选框和单选框

    视频地址:http://v.qq.com/page/m/8/c/m0150izlt8c.html 大家好,欢迎来到[三石jQuery视频教程],我是您的老朋友 - 三生石上. 今天,我们要通过基本的H ...

  7. js 复选框 全选都选 如果某一个子复选框没选中 则全选按钮不选中

    <!DOCTYPE HTML> <html> <head> <meta charset=UTF-8> <title>js 复选框 全选都选 ...

  8. 原生js实现在表格用鼠标框选并有反选功能

    今天应同学要求,需要写一个像Excel那样框选高亮,并且实现框选区域实现反选功能.要我用原生js写,由于没什么经验翻阅了很多资料,第一次写文章希望各位指出不足!! 上来先建表 <div clas ...

  9. WPF: 实现带全选复选框的列表控件

    本文将说明如何创建一个带全选复选框的列表控件.其效果如下图:     这个控件是由一个复选框(CheckBox)与一个 ListView 组合而成.它的操作逻辑: 当选中“全选”时,列表中所有的项目都 ...

随机推荐

  1. UVa 10131: Is Bigger Smarter?

    动态规划题.类似UVa103 Stacking Box,都是题目给一种判断嵌套的方法然后求最长序列.提前对数据排序可以节省一些时间开销. 我的解题代码如下: #include <iostream ...

  2. HDU 4521 小明系列问题——小明序列 (线段树维护DP)

    题目地址:HDU 4521 基本思路是DP.找前面数的最大值时能够用线段树来维护节省时间. 因为间隔要大于d. 所以能够用一个队列来延迟更新,来保证每次询问到的都是d个之前的. 代码例如以下: #in ...

  3. POJ Secret Milking Machine 【网络流+二分】

    题意:各一个地图,两点之间有若干条路,要在节点1和节点n之间行走t次(就是问1到n的路径数至少为t,每一条路径不能有重复),问所有路径里面最长的部分(这个题目特别强调,不是路径长度和,是路径中相邻两点 ...

  4. Definitions

    Definitions and ODR Definitions are declarations that fully define the entity introduced by the decl ...

  5. NetBeans文件被锁，无法修改

    今天用NetBeans写有关Dojo的一个样例时,出现文件被锁,无法修改的情况.找了半天,但是就是不知道是什么原因,我就写在博客上记录下来

  6. HTML5 DTD

    HTML5/HTML 4.01/XHTML 元素和有效的 DTD 下面的表格列出了所有的 HTML5/HTML 4.01/XHTML 元素,以及它们会出现在什么文档类型 (DTD) 中: 标签 HTM ...

  7. CentOS搭建PHP服务器环境(LAMP)

    安装httpd mysql mysql-server php: yum install -y httpd mysql mysql-server php php-devel 安装php的扩展 yum i ...

  8. linux分区工具fdisk的使用

    fdisk是linux下的一块分区工具,使用简单方便,由于是对系统进行修改,需要root权限. 常用参数如下: fdisk  -l : 列出所有的硬盘信息 直接传入设备名称可进入对该硬盘分区.例如,f ...

  9. c++ 复制构造函数和赋值函数

    c++ 自动提供了下面这些成员函数 1默认构造函数 2.复制构造函数 3.赋值操作符 4.默认析构函数 5.地址操作符 赋值构造函数copy construtor 用于将一个对象复制到新创建的对象中, ...

  10. cocos2d-x游戏开发系列教程-超级玛丽10-怪物与马里奥冲突检测

    在超级玛丽游戏中,马里奥在移动,怪物也在移动,当他们遇见时,需要判断是马里奥身亡还是怪物身亡. 这个判断的代码在怪物类的检测函数实现中. 比如蘑菇怪的冲突检测函数: bool CMMonsterMus ...