<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. MIME类型列表

    A Multipurpose Internet Mail Extensions (MIME) type is a standard that indicates the nature and form ...

  2. 数据导入报错：Got a packet bigger than‘max_allowed_packet’bytes的问题

    数据导入报错:Got a packet bigger than‘max_allowed_packet’bytes的问题 2个解决方法: 1.临时修改:mysql>set global max_a ...

  3. 【黑金原创教程】【FPGA那些事儿-驱动篇I 】实验十四：储存模块

    实验十四比起动手笔者更加注重原理,因为实验十四要讨论的东西,不是其它而是低级建模II之一的模块类,即储存模块.接触顺序语言之际,“储存”不禁让人联想到变量或者数组,结果它们好比数据的暂存空间. . i ...

  4. Web Uploader在低版本IE下无法显示Flash的一种情况

    用户反馈在IE 8下无法正常显示Web Uploader控件,并已安装了Flash插件.调试发现在内部抛出了Runtime Error的错误,关键代码如下: Runtime.create = func ...

  5. Visual Studio 2013编译Mozilla NPAPI 示例注意事项

    1.Platform Toolset设置Visual Studio 2013 - Windows XP (v120_xp). 2.Character Set设置Use Multi-Byte Chara ...

  6. 常用linux命令及shell脚本

    参考:Linux命令大全 分割大文件 Split命令 按行分割(只能是文本文件) $split -l 1000 big_file 前缀 按文件大小分割 $split -b 64m big_file 前 ...

  7. Win8安装msi程序出现2502、2503错误解决方法

    在Win8中,在安装msi安装包的时候常常会出现代码为2502.2503的错误.其实这种错误是由于安装权限不足造成的,因为这种msi的安装包不像其他exe的安装程序, 在安装包上点击"右键& ...

  8. iOS的socket开发基础

    目录[-] socket简介 tcp和udp的区别 TCP三次握手和四次挥手 TCP三次握手 tcp四次挥手 tcpsocket和udpsocket的具体实现 tcpsocket的具体实现 udpso ...

  9. js模拟点击打开超链接

    js模拟点击打开超链接,页面上有一些锚文本,如果用 JS 批量在新窗口打开. jquery示例: <div class="link"> <a href=" ...

  10. vue报错 Uncaught TypeError: Cannot read property ‘children ’ of null

    Uncaught TypeError: Cannot read property ‘children ’ of null ratings未渲染完毕,就跳走goods了,取消默认跳转,即可