思路：通过选择全选的选框的状态stuts 即true/false控制其他选框。

首先 我们要通过.checked方法获取选框（全选/全不选）的值。

function all(){

   var stuts=document.getElementById("xuan").checked;

   console.log(stuts);

}

此时控制台会打印选中（true）和不选中（false）的值。

通过getElementsName获取名字相同的checke选框成一个集合，在通过遍历集合更改每个选框的状态值。

c[i].checked=stuts;

反选就是让状态值相反即可

 c[i].checked=!c[i].checked;

源码：

 <!DOCTYPE html>

 <html lang="en">

 <head>

     <meta charset="UTF-8">

     <title>Title</title>

 </head>

 <body>

 <input type="checkbox" name="c">1<br>

 <input type="checkbox" name="c">2<br>

 <input type="checkbox" name="c">3<br>

 <input type="checkbox" name="c">4<br>

 <input type="checkbox" name="c">5<br>

 <input type="checkbox" name="c">6<br>

 <input type="checkbox" name="c">7<br>

 <hr>

 <input type="checkbox" id="xuan" onchange="a()">全选/全不选<br>

 <input type="button" id="fan" onclick="fan()" value="反选">

 <script>

   function a() {

     var stuts=document.getElementById("xuan").checked;

     var c=document.getElementsByName("c");

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

         c[i].checked=stuts;

     }

   }

   function fan() {

     var stuts=document.getElementById("fan");

     var c=document.getElementsByName("c");

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

       c[i].checked=!c[i].checked;

     }

   }

 </script>

 </body>

 </html>

js(四) 全选/全不选和反选的更多相关文章

  1. JS checkbox 全选 全不选

    /* JS checkbox 全选 全不选 Html中checkbox: <input type="checkbox" name="cbx" value= ...

  2. JS中表格的全选和删除要注意的问题

    在项目开发中,由于刚刚开始做项目,我对js还不是很精通,所以在用js对表格的全选和删除中遇到了不少问题,后来通过查找资料解决了,之后总结了一下关于js表格的全选和删除出现的一些问题,希望能帮助到大家. ...

  3. JS实现全选、不选、反选

    思路:1.获取元素.2.用for循环历遍数组,把checkbox的checked设置为true即实现全选,把checkbox的checked设置为false即实现不选.3.通过if判断,如果check ...

  4. js实现全选/全不选、反选

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

  5. asp.net中Repeater结合js实现checkbox的全选/全不选

    前台界面代码: <input name="CheckAll" type="checkbox" id="CheckAll" value= ...

  6. js进阶 9-16 如何实现多选框全选和取消

    js进阶 9-16 如何实现多选框全选和取消 一.总结 一句话总结:选择取到每一个checkbox的值,然后赋值为true或者false就好. 1.如何实现多选框全选和取消? 选择取到每一个check ...

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

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

  8. 用 JS（JavaScript ）实现多选、全选、反选

    JS小例题 学习内容: 需求 总结: 学习内容: 需求 用 JavaScript 实现全选.反选.多选 实现代码 <!DOCTYPE html PUBLIC "-//W3C//DTD ...

  9. js之checkbox的代码全选/全不选，使用id获取元素，而不是name

    每当有多个选项的时候,都会有一种想法是:全选,全不选,如果子选项有被选,父选项也得被选. 注意:这里是根据id来获取元素的,但是不能直接用getElementById,因为那只能返回一个,而不是集合. ...

随机推荐

  1. 【codeforces Manthan, Codefest 17 C】Helga Hufflepuff's Cup

    [链接]h在这里写链接 [题意]     k是最高级别的分数,最高界别的分数最多只能有x个.     1<=k<=m;     和k相邻的点的分数只能小于k;     n个点的树,问你每个 ...

  2. 使用 Swift 构建自定义的ActivityIndicator View

    目前在自己的个人项目里,已经开始使用Swift去编写代码.这篇文章把项目中自己设计的一个ActivityIndicator View展示给大家. 在开始之前,我们先看看最终的效果,如下图: 我建议大家 ...

  3. oracle管理索引

    索引是用于加速数据存取的数据对象,合理的使用索引可以大大降低I/O次数,从而提高数据访问性能.索引有很多种我们主要介绍常用的几种: 为什么添加了索引或,会加快查询速度呢? n  单列索引 单列索引是基 ...

  4. bzoj3522 Hotel

    Description 有一个树形结构的宾馆,n个房间,n-1条无向边,每条边的长度相同,任意两个房间可以相互到达.吉丽要给他的三个妹子各开(一个)房(间).三个妹子住的房间要互不相同(否则要打起来了 ...

  5. js遮罩

    1.1 背景半透明遮罩层样式 需要一个黑色(当然也可以其他)背景,且须设置为绝对定位,以下是项目中用到的css样式: /* 半透明的遮罩层 */ #overlay { background: #000 ...

  6. 条件变量用例--解锁与signal的顺序问题

    我们知道,当调用signal/broadcast唤醒等待条件变量的其他线程时,既可以在加锁的情况下调用signal/broadcast,也可以在解锁的情况下调用. 那么,到底哪种情况更好呢?man手册 ...

  7. sql —— having

    在 SQL 中增加 HAVING 子句原因是,WHERE 关键字无法与聚合函数一起使用.HAVING 子句可以让我们筛选分组后的各组数据. 原表: 我们可以对上面数据根据性别这个字段进行分组查询,分别 ...

  8. 在JS中模拟表单的post提交，进行页面的跳转

    原文链接:https://blog.csdn.net/jal517486222/article/details/83147761 /* *功能: 模拟form表单的提交 *参数: URL 跳转地址 P ...

  9. dataframe添加元素指定为列表,不同for循环命名空间下的变量重复问题

    split=pd.DataFrame({'data':[0],'len':0,'count':0},index=[0])for i_t in range(over_128.shape[0]): ct= ...

  10. c#操作sqlite db3数据库

    首先添加引用 System.Data.SQLite.dll,引用只用添加这个,但SQLite.Interop.dll文件必须也和它同时放在Debug目录下 然后可用: SQLiteConnection ...