html checkbox全选反选

最新推荐文章于 2021-09-10 16:48:36 发布

JianfeiMa

最新推荐文章于 2021-09-10 16:48:36 发布

阅读量262

点赞数

分类专栏：前端

本文链接：https://blog.csdn.net/HardProgrammer/article/details/105103068

版权

前端专栏收录该内容

6 篇文章 0 订阅

订阅专栏

<html>
<body>

   <table border="1">
       <tr>
           <th><input type="checkbox" οnclick="swapCheck()" /></th>
           <th>Month</th>
           <th>Savings</th>
       </tr>
       <tr>
           <td><input type="checkbox" /></td>
           <td>January</td>
           <td>$100</td>
       </tr>
       <tr>
           <td><input type="checkbox" /></td>
           <td>February</td>
           <td>$150</td>
       </tr>
   </table>

   <script type="text/javascript"
       src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js"></script>

   <script type="text/javascript">
       //checkbox 全选/取消全选
       var isCheckAll = false;
       function swapCheck() {
           if (isCheckAll) {
               $("input[type='checkbox']").each(function() {
                   this.checked = false;
               });
               isCheckAll = false;
           } else {
               $("input[type='checkbox']").each(function() {
                   this.checked = true;
               });
               isCheckAll = true;
           }
       }
   </script>

</body>
</html>

JianfeiMa

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
html checkbox全选反选

<html><body> <table border="1"> <tr> <th><input type="checkbox" onclick="swapCheck()" /></th> <th>Month</th&gt...
复制链接

扫一扫