<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. android cannot locate symbol 'sigemptyset'问题解决

    设备是android 4.1的平板电脑,支持armeabi-v7a和mips,为了能用上poco c++ lib,用cmake编译了poco mips架构的lib,但在android studio里引 ...

  2. LeetCode 33 Search in Rotated Sorted Array（循环有序数组中进行查找操作）

    题目链接 :https://leetcode.com/problems/search-in-rotated-sorted-array/?tab=Description   Problem :当前的数组 ...

  3. sencha touch 自定义事件

    需要添加自定义事件可以如下: this.fireEvent('back', this); 此方法第一个参数为你想要监听的事件,之后的参数为你想要传递的参数一般来说第一个参数最好是控件本身. 同理这个方 ...

  4. wireshark 表达式备忘录

    参考资料: https://blog.csdn.net/wojiaopanpan/article/details/69944970 wireshark分两种表达式,一种是捕获表达式,这个是在捕获时用的 ...

  5. HTML display:inline-block

    元素转换 display:block;   行内转块 Display:inline;   块转行内 Display:inline-block;  块或行内转行内块 链接伪类 a:link{属性:值;} ...

  6. Spring加载xsd文件报错：because 1) could not find the document; 2) the document could not be read...

    Spring启动时加载xml文件的过程: spring在加载xsd文件时总是先试图在本地查找xsd文件(spring的jar包中已经包含了所有版本的xsd文件),如果没有找到,才会转向去URL指定的路 ...

  7. 关于python的【if __name__ == "__main__":】

    学习东西真的需要自己动手,然后遇到问题,自己学着去解决.当然如果能得到高人指点,那真是走了八辈子运了.可以节省很多时间.但是大多数情况下,不能总是有高人来指点我们.这时就需要靠我们自己了. 在学习py ...

  8. Oracle数据迁移之rman活动数据库复制

    1.设置主库为归档模式 SQL> shutdown immediate SQL> startup mount SQL> alter database archivelog; SQL& ...

  9. 对position的认知观

    position :absolute 认识以前有的理解不正确,以为没有设置left,top 与设置left :0,top : 0是一样的,现在认识为,错误! 没有设置的时候,该absolute元素{由 ...

  10. @font-face 字体图标的应用

    所谓字体图标,顾名思义就是图标以字体的形式存在,可以利用 font-size.color 对字体图标的大小和颜色进行渲染.将小图标集中放到字体库里,利用css3 @font-face 引用图标,不仅有 ...