<!doctype html>
      <html lang="en">
      <head>
      <meta charset="UTF-8">
      <meta name="Generator" content="EditPlus®">
      <meta name="Author" content="">
      <meta name="Keywords" content="">
      <meta name="Description" content="">
      <title>Document</title>

      <script>
      function checkAll( booleanValue )
      {
      var checkboxset= document.getElementsByName("hobby");
      for(var i =0;i<checkboxset.length; i++ )
      {
      checkboxset[i].checked = booleanValue;
      }

      }

      function reverseCheck(){

      //找到所有的checkbox
      //针对每一个checkbox，判断其当前的checked属性，并且置反

      var checkboxset= document.getElementsByName("hobby");
      for(var i =0;i<checkboxset.length; i++ )
      {
      checkboxset[i].checked = !checkboxset[i].checked;

      }

      }

      </script>

      </head>
      <body>

      <h1>请选择你的爱好：</h1>
      全选/全不选<input type="checkbox" name="hobbys" onclick="checkAll(this.checked)" /><br/>

      <input type="checkbox" name="hobby" value="football" onclick=""/>足球
      <input type="checkbox" name="hobby" value="basketball" onclick=""/>篮球
      <input type="checkbox" name="hobby" value="swim" onclick=""/>游泳
      <input type="checkbox" name="hobby" value="singing" onclick=""/>唱歌<br/>

      <input type="button" value="全选" onclick="checkAll(true)"/> <input type="button" value="全不选" onclick="checkAll(false)"/>
      <input type="button" value="反选" onclick="reverseCheck()"/>
      </body>

      </body>
      </html>

JavaScript下全选反选的Demo程序里实现checkmeonly函数 DOM的更多相关文章

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

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

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

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

  3. 用javascript实现全选/反选组件

    以下是本人制作的全选/反选 组件,供广大同行参考.指正: 效果如图: 在实现的过程中,全选和全部取消选中这两个功能较为简单,只需用for循环遍历所有复选框为true或false即可.反选也较为简单,也 ...

  4. JavaScript、全选反选-课堂笔记

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  5. 用JavaScript实现全选-反选

    实现全选-反选 在日常生活我们会遇到需要全选-反选的地方,其实用JavaScript也能实现. 样式如下所示: 样式代码如下所示: <!DOCTYPE html PUBLIC "-// ...

  6. 关于Winform下DataGridView中实现checkbox全选反选、同步列表项的处理

    近期接手一个winform 项目,虽然之前有.net 的经验,但是对一些控件的用法还不是很熟悉. 这段时间将会记录一些在工作中遇到的坎坷以及对应的解决办法,写出来与大家分享并希望大神提出更好解决方法来 ...

  7. javascript总结41:表格全选反选,经典案例详解

    <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...

  8. Android开发 ---基本UI组件5：监听下拉选项，动态绑定下拉选项、全选/反选，取多选按钮的值，长按事件，长按删除，适配器的使用，提示查询数据，activity控制多按钮

    效果图: 效果描述: 1.当点击 1 按钮后,进入选择城市的页面,会监听到你选中的城市名称:动态为Spinner绑定数据 2.当点击 2 按钮后,进入自动查询数据页面,只要输入首字母,就会动态查找以该 ...

  9. JavaScript Web API 全选反选案例

    全选反选 全选和反选功能,在开发中可以说是应用得非常多的,以下通过案例分解,学习如何使用JS实现全选反选功能. 该功能可分为如下三大步骤: 1.全选 1.1 获取父checkbox,注册点击事件 1. ...

随机推荐

  1. H面试程序（27）：字串转换

    //1 字串转换 //问题描述: //将输入的字符串(字符串仅包含小写字母‘a’到‘z’),按照如下规则,循环转换后输出:a->b,b->c,…,y->z,z->a: //若输 ...

  2. 让自己的apk可以被别人用二维码下载

    通过二维码下载的流程是, 1.截获地址当有一个url被二维码扫描后的被截获,请先确认能够被截获. 2.接受intent无论是把这个消息的地址发送给activity,还是reciver,都要进入到你的程 ...

  3. iOS开发--汉字转成没有声调也没有空格的拼音

     //汉字转成没有声调也没有空格的拼音- (NSString *)transformToPinYin:(NSString *)wordStr {    NSMutableString *mutable ...

  4. dict和set的使用

    使用dict和set dict Python内置了字典:dict的支持,dict全称dictionary,在其他语言中也称为map,使用键-值(key-value)存储,具有极快的查找速度. 举个例子 ...

  5. shell 脚本中$$,$#,$?分别代表什么意思?

    $0 这个程式的执行名字$n 这个程式的第n个参数值,n=1..9$* 这个程式的所有参数,此选项参数可超过9个.$# 这个程式的参数个数$$ 这个程式的PID(脚本运行的当前进程ID号)$! 执行上 ...

  6. Windows Azure 社区新闻综述（#77 版）

    欢迎查看最新版本的每周综述,其中包含有关云计算和 Windows Azure 的社区推动新闻.内容和对话.以下是本周的亮点. 文章.视频和博客文章 ·   文章: Windows Azure 表存储简 ...

  7. IT第二天 - JAVA环境的配置、Hello的编写

    IT第二天 上午 HTML的一些讲解 下午 JDK的安配置 JAVA语法的注意事项 Hello的编写 晚上 作业 对println的应用 笔记 1.Classpath环境变量的配置:因为DOS对于文件 ...

  8. BZOJ 1632: [Usaco2007 Feb]Lilypad Pond

    题目 1632: [Usaco2007 Feb]Lilypad Pond Time Limit: 5 Sec  Memory Limit: 64 MBSubmit: 390  Solved: 109[ ...

  9. cocos2dx的runAction: 反复运行,多个动作连接运行,多个动作同一时候运行的实现

    cocos2dx的 runAction,假设某个动作重复运行用cc.RepeatForever:create, 多个动作连接运行用cc.Sequence:create,多个动作同一时候运行用cc.Sp ...

  10. [置顶] NGINX原理分析之SLAB分配机制

    一.基础概述 如果使用伙伴系统分配和释放算法,不仅会造成大量的内存碎片,同时处理效率也比较低.SLAB是一种内存管理机制,其核心思想是预分配.SLAB是将空间按照SIZE对内存进行分类管理的,当申请一 ...