<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Document</title>

</head>

<body>

<div>

    <label><input type="checkbox" name="aAll">全选</label><br>

    <label><input type="checkbox" name="a">A</label><br>

    <label><input type="checkbox" name="a">B</label><br>

    <label><input type="checkbox" name="a">C</label>

</div>

<script type="text/javascript">

    var all = document.getElementsByName("aAll")[0];

    var aCheck = document.getElementsByName("a");

    all.onclick = function(){

        if(this.checked){

            for(var i of aCheck){

                i.checked = true;

            }

        }else{

            for(var i of aCheck){

                i.checked = false;

            }

        }

    }

    for(var i of aCheck){

        i.onclick = function(){

            if(!this.checked){

                all.checked = false;

            }

        }

    }

</script>

</body>

</html>

checkbox 点击全选的更多相关文章

  1. js之全选即点击全选标签可选择全部复选框

    目标效果:网页全选功能,即点击全选标签可选择全部复选框 实现代码如下 <!DOCTYPE html> <html lang="en"> <head&g ...

  2. 【jQuery】CheckBox使用attr全选无法正确显示

    今天编写JS脚本时,遇到如下的问题. 下面是源代码: <script src="../Scripts/jquery-2.1.3.js"></script> ...

  3. C# winform中的datagridview控件标头加入checkbox，实现全选功能。

    /// <summary> /// 给DataGridView添加全选 /// </summary> public class AddCheckBoxToDataGridVie ...

  4. Jquery 利用单个复选款（checkbox）实现全选、反选

    1 <script type="text/javascript"> $(function(){ //全选 $("#CheckedAll").clic ...

  5. html5与js关于input[type='text']文本框value改变触发事件一些属性的区别oninput,onpropertychange,onchange和文本框的value点击全选状态onclick="select();"。做购物车页面时会要用到。

    关于input[type='text']文本框value改变触发事件一些属性的区别oninput,onpropertychange,onchange和文本框的点击全选状态onclick="s ...

  6. jquery操作checkbox方法（全选、全不选、至少选择一个、选择值/文本）

    原文:http://blog.csdn.net/u014079773/article/details/52371382 在实际开发中我们经常操作checkbox,不仅仅要获得checkbox选中的值, ...

  7. 2016/3/30 租房子 ①建立租房子的增、删、改php页面 ②多条件查询 ③全选时 各部分全选中 任意checkbox不选中 全选checkbox不选中

    字符串的另一种写法:<<<AAAA; 后两个AA回车要求顶格  不然报错 例子: <!DOCTYPE html> <html lang="en" ...

  8. ListView加checkBox可以实现全选等功能

    1.效果图 2.LIteView_item布局 <?xml version="1.0" encoding="utf-8"?> <Relativ ...

  9. checkbox的单选全选，反选，计算价格，删除

    activity_main.xml <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android&qu ...

随机推荐

  1. python 第三方库 chardet

    chardet是一个非常优秀的编码识别模块.chardet 是python的第三方库,需要下载和安装,放在python安装根目录\Lib\site-packages下面 import chardet ...

  2. MVC的传递数据的方法

    1.使用ViewBag #region 0.2 Action方法 + ActionResult Index2() /// <summary> /// Action方法 /// </s ...

  3. php的数组与数据结构

    一.数组的分类与定义 分类: 1.索引数组  $array = array(1,2,3,4,5); 2.关联数组  $array=array(1=>"aa","bb ...

  4. Note_Master-Detail Application(iOS template)_01_YJYAppDelegate.h

    //YJYAppDelegate.h #import <UIKit/UIKit.h> @interface YJYAppDelegate : UIResponder <UIAppli ...

  5. Fractal Tree扩展

    之前的博客实现了最基础的分形树,在这个基础上略微调整一些参数可以得到很多有趣的由分形树发展出的图案. private void drawShape(Graphics g, double x1, dou ...

  6. java课程三课堂例子验证

    1.ClassAndObjectTest.java 验证截图: 2.ObjectEquals.java 运行截图: 3.InitializeBlockDemo.java   Java进行初始化的地方有 ...

  7. BZOJ 1600 建造栅栏

    O(N)分成1,2与3,4两部分搞一搞. #include<iostream> #include<cstdio> #include<cstring> #includ ...

  8. 【Tsinghua OJ】灯塔(LightHouse)问题

    描述 海上有许多灯塔,为过路船只照明.从平面上看,海域范围是[1, 10^8] × [1, 10^8] . (图一) 如图一所示,每个灯塔都配有一盏探照灯,照亮其东北.西南两个对顶的直角区域.探照灯的 ...

  9. Python - 学习经验分享

    执行方式: 直接输入python进入命令行,进行单行输入执行,退出后不保存. python filename.py或./filename.py 直接执行脚本文件 脚本格式: #!/usr/bin/py ...

  10. hdu1033Defragment

    参考:http://blog.csdn.net/ll365594480/article/details/6843449 [题意]磁盘分为N个簇,一个文件可以占用K个簇,(1 <= K < ...