<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. 墨菲定律：当你觉得一个地方可能有bug，那么这个地方就会有bug----顺带了解下Tomcat那少有人注意的localhost.log

    一.问题概述 题目有点长,但应该值得后端java们了解下有点小坑的localhost.log,让我长话短说. 博主是搞java后端的.后台是很简单的spring mvc + spring框架. 今天测 ...

  2. ELK系列四：Logstash的在ELK架构中的使用和简单的输入

    1.ELK架构中Logstash的位置: 1.1.小规模集群部署(学习者适用的架构) 简单的只有Logstash.Elasticsearch.Kibana,由Logstash收集日志或者流量信息,过滤 ...

  3. Unity3D 记第二次面试

    2014-03-10 忍不住投递了几份简历大概有20个,总共收到面试电话2个,十分之一.一个是11号下午4点面试另一个是12号下午3点面试(后来没去至于原因下面有)12号没去,为什么?因为招聘要求“精 ...

  4. iOS - 自动化编译打包(Jenkins)

    从xcodebuild到shenzhen,再到Jenkins,完美演绎自动化操作. Features xcodebuild自动构建命令 简介 构建 生成ipa文件 利用 shenzhen 进行打包 J ...

  5. yii---模型的创建

    在 model/ 路径新建 Test.php 模型 我们类的名称一定要与数据表的名称相同. 继承 yii\db\ActiveRecord 类: 在模型类中 声明 tableName() 指定表名 // ...

  6. Failed to start LSB: Bring up/down networking.

    由于我的虚拟机是从别的机器拷贝过来的,导入新机器后,没有问题,第二天就网络连接不上了,就出现下面的错误 [root@centos ~]# /etc/init.d/network restart Res ...

  7. uploadify3.2.1 多文件上传总是只能上传一个文件

    再网上找了老半天原因,有人说是上传时调用方法参数应该加上*号(:$('#mulfile_upload').uploadify('upload','*');) 总是不行, 我怀疑下面的原因: 我就以为是 ...

  8. POJ 3067 - Japan - [归并排序/树状数组(BIT)求逆序对]

    Time Limit: 1000MS Memory Limit: 65536K Description Japan plans to welcome the ACM ICPC World Finals ...

  9. Hadoop Single Node Setup（hadoop本地模式和伪分布式模式安装-官方文档翻译 2.7.3）

    Purpose(目标) This document describes how to set up and configure a single-node Hadoop installation so ...

  10. linux UVC and hardware viewer

    至于从哪个版本开始内核支持UVC,官方的话是“Linux 2.6.26 and newer includes the Linux UVC driver natively.” 1.查看摄像头ID: [r ...