html的checkbox標(biāo)簽全選與取消全選

admin 建站教程評(píng)論6891字?jǐn)?shù) 1193閱讀模式

1.html代碼：

  1. <body>  
  2.     <table border="1">  
  3.         <tr>  
  4.             <th><input type="checkbox" onclick="swapCheck()" /></th>  
  5.             <th>衣服</th>  
  6.             <th>褲子</th>  
  7.         </tr>  
  8.         <tr>  
  9.             <td><input type="checkbox" /></td>  
  10.             <td>$20</td>  
  11.             <td>$100</td>  
  12.         </tr>  
  13.         <tr>  
  14.             <td><input type="checkbox" /></td>  
  15.             <td>$30</td>  
  16.             <td>$150</td>  
  17.         </tr>  
  18.     </table>  
  19. </body>  

2.jQuery代碼（功能實(shí)現(xiàn)）

  1. <script type="text/javascript"src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js"></script>  
  2. <script type="text/javascript">  
  3.     //checkbox 全選/取消全選  
  4.     var isCheckAll = false;  
  5.     function swapCheck() {  
  6.         if (isCheckAll) {  
  7.             $("input[type='checkbox']").each(function() {  
  8.                 this.checked = false;  
  9.             });  
  10.             isCheckAll = false;  
  11.         } else {  
  12.             $("input[type='checkbox']").each(function() {  
  13.                 this.checked = true;  
  14.             });  
  15.             isCheckAll = true;  
  16.         }  
  17.     }  
  18. </script>  
  1. 注：<script type="text/javascript"src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js"></script> 這段代碼不可缺失 否則無(wú)法實(shí)現(xiàn)效果  

版權(quán)聲明：文章圖片資源來(lái)源于網(wǎng)絡(luò),如有侵權(quán)，請(qǐng)留言刪除!!!
廣告也精彩
admin
  • 本文由 發(fā)表于 2021年2月2日 20:17:57
  • 轉(zhuǎn)載請(qǐng)務(wù)必保留本文鏈接：http://yudch.cn/7128.html
匿名

發(fā)表評(píng)論

匿名網(wǎng)友 填寫(xiě)信息

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen: