<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. JavaScript推断E-mail地址是否合法

    编写自己定义的JavaScript函数checkEmail(),在该函数中首先推断E-mail文本框是否为空,然后在应用正則表達式推断E-mail地址是否合法,假设不合法提示用户 <script ...

  2. Oracle 表三种连接方式(sql优化）

    在查看sql执行计划时,我们会发现表的连接方式有多种,本文对表的连接方式进行介绍以便更好看懂执行计划和理解sql执行原理. 一.连接方式: 嵌套循环(Nested Loops (NL)) (散列)哈希 ...

  3. 编译和安装shibboleth-sp遇到的问题

    In file included from mod_shib_20.cpp:68: mod_shib.cpp:118: warning: deprecated conversion from stri ...

  4. C#多线程编程简述

    NET将关于多线程的功能定义在System.Threading名字空间中.因此,要使用多线程,必须先声明引用此名字空间(using System.Threading;). a.启动线程顾名思义,“启动 ...

  5. JS拖动DIV布局

    方法一: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3 ...

  6. WebService开发实例（Axis2实现，无需安装，快速实现）

    曾经做过的项目里涉及Android客户端向服务器发送请求,服务器访问数据库获得数据并返回给Android客户端.当时Android客户端与服务器的通信已经实现,我只负责客户端布局和数据呈现的部分,近日 ...

  7. 在word中批量制作条形码

    条码打印软件可以批量生成条形码然后直接打印,但是有些客户不需要直接打印,而是想将生成的条形码在word中进行排版,发给自己的客户或者下属部门来打印.那么如何实现在word中批量制作条形码呢? 操作很简 ...

  8. 《Python学习手册》

    读书笔记请见Github博客:http://wuxichen.github.io/Myblog/reading/2014/10/04/LearningPython.html

  9. poj 1035 Spell checker(hash)

    题目链接:http://poj.org/problem?id=1035 思路分析: 1.使用哈希表存储字典 2.对待查找的word在字典中查找,查找成功输出查找成功信息 3.若查找不成功,对word增 ...

  10. CUDA samples 第三章 sample reference 概况

    示例代码分为下列几类: 1.   Simple Reference 基础CUDA示例,适用于初学者, 反应了运用CUDA和CUDA runtime APIs的一些基本概念. 2.   Utilitie ...