checkbox全部选中或者取消

最新推荐文章于 2022-06-01 15:30:28 发布

王莹月

最新推荐文章于 2022-06-01 15:30:28 发布

阅读量2.7k

点赞数

分类专栏： javascript 文章标签： border function 产品

本文链接：https://blog.csdn.net/getchance/article/details/7640228

版权

javascript 专栏收录该内容

7 篇文章 0 订阅

订阅专栏

<html>
<head>
  <script type="text/javascript">
       function checkAll(field){
         var checkboxes = document.getElementsByName("choice");
         for(var i=0;i<checkboxes.length;i++){
        	 checkboxes[i].checked = field.checked;
          }
      }
    
    </script>
  </head>
  
  <body>

   <div><table width="100%" border="1" cellpadding="1" style="text-align:center">
  <tr>
    <td><input id="allchecked" type="checkbox" οnclick="checkAll(this);">全选</td>
    <td><b>产品名称</b></td>
    <td><b>价格（元）</b></td>
    <td><b>数量</b></td>
  </tr>
  <tr>
    <td><input name="choice" type="checkbox"></td>
    <td>李宁</td>
    <td>300</td>
    <td>500</td>
  </tr>
  <tr>
    <td><input name="choice" type="checkbox"></td>
    <td>耐克</td>
    <td>600</td>
    <td>500</td>
  </tr>
  <tr>
    <td><input name="choice" type="checkbox"></td>
    <td>以纯</td>
    <td>200</td>
    <td>500</td>
  </tr>
  <tr>
    <td><input name="choice" type="checkbox"></td>
    <td>森马</td>
    <td>200</td>
    <td>500</td>
  </tr>
  <tr>
    <td><input name="choice" type="checkbox"></td>
    <td>美特</td>
    <td>200</td>
    <td>500</td>
  </tr>
  <tr>
    <td><input name="choice" type="checkbox"></td>
    <td>真维斯</td>
    <td>200</td>
    <td>500</td>
  </tr>
</table>
</div>
   
  </body>
</html>