实现效果：

html代码：

 <body>

 <input type="checkbox" id="checkAll"/>全选<br>

 <hr>

 <input type="checkbox" name="color"/>红色<br>

 <input type="checkbox" name="color"/>黄色<br>

 <input type="checkbox" name="color"/>蓝色<br>

 </body>

JS代码：

 <script>

     window.onload=function()

     {

         document.getElementById("checkAll").onclick = checkall;

     }

     function checkall()

     {

         var dom = document.getElementById("checkAll");

         var doms = document.getElementsByName("color");

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

         {

             doms.item(i).checked = dom.checked;

         }

     }

 </script>

使用JavaScript实现复选框全选与取消的功能的更多相关文章

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

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

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

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

  3. 复选框全选、全不选和反选的效果实现VIEW:1592

    <html> <head> <meta http-equiv="Content-Type" content="text/html; char ...

  4. html+css+js实现复选框全选与反选

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/ ...

  5. checkbox复选框全选批量删除

    多选框全选实现批量删除 html代码 <body> <form action="" method="post" name="Form ...

  6. jQuery 复选框全选/取消全选/反选

    jQuery实现的复选框全选/取消全选/反选及获得选择的值. 完整代码: <!DOCTYPE html> <html> <head> <script type ...

  7. js 判断 复选框全选、全不选、反选、必选一个

    一个挺 使用的 js 代码片段,  判断  复选框全选.全不选.反选.必选一个 记录下, 搬来的 思路: 修改数据的 选中与否状态, 拿到所有的输入框,看是否有选中的状态 <html> & ...

  8. jQuery实现复选框 全选、反选、全不选

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <hea ...

  9. jQuery中的几个案例：隔行变色、复选框全选和全不选

    1 表格隔行变色 1 技术分析: 1 )基本过滤选择器: odd: even: 2 )jq添加和移除样式: addClass(); removeClass(); 2 代码实现 <script s ...

  10. js实现复选框全选/全不选/反选

    js实现复选框全选/全不选/反选 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "h ...

随机推荐

  1. python 02

    函数的参数 默认参数: 函数的基本形参, 可以有默认参数, 什么是基本形参呢, 就是普通变量, 如字符串, 数字等. 并且带有默认参数的形参, 要放在后边. 传参时, 不必将所有的参数都传递, 可以只 ...

  2. jquery.nicescroll完美滚动条使用方法

    配置参数 当调用"niceScroll"你可以传递一些参数来定制视觉方面: cursorcolor - 十六进制改变光标颜色,默认值是"#000000" cur ...

  3. netperf安装及使用

    一.简介 Netperf是由惠普公司开发的,测试网络栈.即测试不同类型的网络性能的benchmark工具,大多数网络类型TCP/UPD端对端的性能,得到网络上不同类型流量的性能参数.Netperf根据 ...

  4. Oracle笔记二

    一.数据库语言分类  二.DML之数据插入 把一个表中的数据查询出来插入另外一个表中. create table student(id number,name varchar2(20),age num ...

  5. OpenGL利用模板测试实现不规则裁剪

    本文是原创文章,如需转载,请注明文章出处 在游戏开发中,经常会有这样的需求:给定一张64x64的卡牌素材,要求只显示以图片中心为圆点.直径为64的圆形区域,这就要用到模板测试来进行不规则裁剪. 实现不 ...

  6. Android 常用布局视图

    常用包 http://square.github.io/ EventBus Scroller 滚动 拖拽 # android.support.design.widget.CollapsingToolb ...

  7. JAVA OO 第二章知识点

    一.JAVA的基础语法 1.关键字 ①关键字:关键字用于定义该门语言,且这些单词对编译器用特殊的含义,而且不能作为标识符. 2.标识符 标识符:在JAVA中我们备选的单词,包括:类名.方法名.字段.变 ...

  8. asp.net ajax与jquery的冲突问题解决

    在网上看到有网友说,用了updatepannel这个asp.net ajax异步更新面板后,javascript或者jquery代码不起作用,实际上,可以在updatepannel的触发器中进行设置解 ...

  9. 关于HTML5、Jquery、Phonegap跨域问题的研究

    我的问题: 近期研究Phonegap的相关技术,遇到了服务资源访问的跨域.经过尝试使用服务器端的代理,Phonegap打包后不能够访问到相应资源.在搜索引擎的帮助下,找到了Jquery的jsonp的方 ...

  10. 5、HTML5列表、块和布局

    1.块元素 块元素在显示的时候,通常会以新行开始 如:<h1> <p> <ul> <!-- 块—>注释 <p>hello</p> ...