zoukankan      html  css  js  c++  java
  • jQuery实现全选,取消,反选

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <title>复选多选反选</title>
    <meta charset="UTF-8">
    <script src="jquery-3.4.1.js"></script>
    </head>
    <body>
    <div>
    <button onclick="selectAll()">全选</button>
    <button onclick="cancel()">取消</button>
    <button onclick="reverse()">反选</button>
    </div>
    <table border="1">
    <tr>
    <td><input type="checkbox"> </td>
    <td>111</td>
    </tr>
    <tr>
    <td><input type="checkbox"></td>
    <td>222</td>
    </tr>
    <tr>
    <td><input type="checkbox"></td>
    <td>333</td>
    </tr>

    </table>
    <script>
    function selectAll() {
    $('table :checkbox').each(function () {
    $(this).prop('checked',true);

    })

    }
    function cancel(){
    $('table :checkbox').each(function () {
    $(this).prop('checked',false);

    })
    }
    function reverse(){
    $('table :checkbox').each(function () {
    if($(this).prop('checked')){
    $(this).prop('checked',false);

    }else{
    $(this).prop('checked',true);

    }


    })

    }
    </script>
    </body>
    </html>

    
    
  • 相关阅读:
    OO第四次总结
    OO第三次总结
    C语言函数指针
    Java对象集合
    emacs下最牛逼的Markdown编辑方式
    OO第二次总结
    Git复习
    Java设计原则
    多线程学习笔记1
    OO第一次总结
  • 原文地址:https://www.cnblogs.com/startl/p/12293420.html
Copyright © 2011-2022 走看看