<style type="text/css">

         table {

             width: 800px;

             text-align: left;

             border-collapse: collapse;

         }

         td, th {

             padding: 10px;

             border: 1px solid black;

         }

     </style>

     <script type="text/javascript">

       //        反选

       function choose(tag) {

         var inputs = document.getElementsByTagName("input");

         //全选

         for (var i = 0; i < inputs.length - 3; i++) {

           var inputNode = inputs[i];

           if (tag === 1) {

             if (!inputs[i].checked) {

               inputs[i].checked = true;

             }

             //全不选

           } else if (tag === -1) {

             if (inputNode.checked) {

               inputNode.checked = false;

             }

           } else {

             //反选

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

           }

         }

       }

     </script>

 </head>

 <body>

 <table cellpadding="2" id="tableId">

     <tr>

         <th>

             选择

         </th>

         <th>

             姓名

         </th>

         <th>

             年龄

         </th>

     </tr>

     <tr>

         <td>

             <label>

                 <input type="checkbox">

             </label>

         </td>

         <td>

             张三

         </td>

         <td>

             19

         </td>

     </tr>

     <tr>

         <td>

             <input type="checkbox">

         </td>

         <td>

             李四

         </td>

         <td>

             18

         </td>

     </tr>

     <tr>

         <td>

             <input type="checkbox">

         </td>

         <td>

             张三

         </td>

         <td>

             18

         </td>

     </tr>

     <tr>

         <td colspan="3">

             <input type="button" onclick="choose(1)" value="全选">

             <input type="button" onclick="choose(-1)" value="全不选">

             <input type="button" onclick="choose(0)" value="反选">

         </td>

     </tr>

 </table>

js全选反选的更多相关文章

  1. jquery、js全选反选checkbox

    操作checkbox,全选反选 //全选 function checkAll() { $('input[name="TheID"]').attr("checked&quo ...

  2. JS全选反选功能

    总选框:<input type="checkbox" class="all" name="all"> 子选框: <inpu ...

  3. js全选 反选

    // 全选 反选 allChoose: function (o) { var obj = $.extend(true, { id: "#id", name: "name& ...

  4. js 全选 反选

    1.全选 function selectAll(form){ for (var i = 0; i < form.elements.length; i++) { if (form.elements ...

  5. 关于js 全选 反选

    prop 对于HTML元素本身就带有的固有属性,在处理时,使用prop方法. attr  对于HTML元素我们自己自定义的DOM属性,在处理时,使用attr方法. $("#selectAll ...

  6. html js 全选 反选 全不选源代码

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

  7. js全选反选按钮实现

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

  8. js 全选反选

    <th><input type="checkbox" id="checkall" name="checkall" oncl ...

  9. js和jq实现全选反选

    在前端中用到全选反选的案例并不少,在这里呢我就实现这个功能给大家参考参考. 这里呢就先贴上我的html和css代码 <div class="wrap"> <tab ...

随机推荐

  1. JUnit（>4.0）@BeforeClass、@Before、@Test、@After、@AfterClass、@Ignore

    JUnit 4 开始使用 Java 5 中的注解(annotation),常用的几个 annotation 介绍: @BeforeClass:针对所有测试,只执行一次,且必须为static void ...

  2. sencha touch 分享到微博扩展

    扩展代码: /* *分享到微博 */ Ext.define('ux.WeiboPicker', { extend: 'Ext.Picker', xtype: 'weiboPicker', config ...

  3. 如何在mysql中查询每个分组的前几名

    问题 在工作中常会遇到将数据分组排序的问题,如在考试成绩中,找出每个班级的前五名等.  在orcale等数据库中可以使用partition 语句来解决,但在MySQL中就比较麻烦了.这次翻译的文章就是 ...

  4. 23种设计模式之适配器模式（Adapter）

    适配器模式将一个接口转换成客户希望的另一个接口,从而使接口不兼容的那些类可以一起工作.适配器模式既可以作为类结构型模式,也可以作为对象结构型模式.在类适配器模式中,通过使用一个具体类将适配者适配到目标 ...

  5. REM+SVG Sprite，web app案例

    REM+SVG Sprite,构建新时代web app <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN&quo ...

  6. Yii---使用事物

    YII使用事物的时候,遇到的一些小问题总结:开始事物,后要进行事物提交,才能操作数据库(折腾了一天)具体使用: yii事物的定义:是指作为单个逻辑工作单元执行的一系列操作,要么完全地执行,要么完全地不 ...

  7. Python3中关于下划线变量和命名的总结

    变量 #!-*-coding:utf-8-*- #__author__ = 'ecaoyng' # # 变量 #_xxx,单下划线开头的变量,标明是一个受保护(protected)的变量,原则上不允许 ...

  8. POJ-放苹果（DP）

    放苹果 Time Limit: 1000MS Memory Limit: 10000K Total Submissions: 29074 Accepted: 18376 Description 把M个 ...

  9. ubuntu16.04下安装opencv3.1.0

    1.安装依赖项 sudo apt--dev pkg-config libavcodec-dev libavformat-dev libswscale-dev 可选的 sudo apt--dev lib ...

  10. 使用Homebrew在Mac OS X EI Capitan上安装与配置nginx和PHP

    安装nginx brew install nginx sudo nginx 测试安装 在浏览器打开下面的链接地址 http://localhost:8080 nginx.conf配置 # HTTPS ...