javascript实现复选框全选功能

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title></title>

    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="this is my page">
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    
    <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
<script type="text/javascript">
function choseAll() {
var all  = document.getElementById("all");
var ch = document.getElementsByName("ch");
for(var i=0;i<ch.length;i++) {
ch[i].checked = all.checked;
}
}
</script>
  </head>
  
  <body>
    <table align="center" border="1" width="70%">
    <tr>
    <td>
    <input type="checkbox" id="all" onclick="choseAll()"/>全选
    </td>
    <td>姓名</td>
    <td>性别</td>
    <td>地址</td>
    <td>部门</td>
    </tr>
    <tr>
    <td>
    <input type="checkbox" name="ch"/>
    </td>
    <td>Jim</td>
    <td>男</td>
    <td>北京市西城区西什库大街</td>
    <td>人事部</td>
    </tr>
    <tr>
    <td>
    <input type="checkbox" name="ch"/>
    </td>
    <td>Henry</td>
    <td>男</td>
    <td>北京市西城区地安门外大街</td>
    <td>市场部</td>
    </tr>
    <tr>
    <td>
    <input type="checkbox" name="ch"/>
    </td>
    <td>Lucy</td>
    <td>女</td>
    <td>北京市崇文区东花市南里</td>
    <td>研发部</td>
    </tr>
    <tr>
    <td>
    <input type="checkbox" name="ch"/>
    </td>
    <td>Lily</td>
    <td>女</td>
    <td>北京市丰台区岳各庄青塔西路</td>
    <td>人事部</td>
    </tr>
    <tr>
    <td>
    <input type="checkbox" name="ch"/>
    </td>
    <td>Kobe</td>
    <td>男</td>
    <td>北京市海淀区五棵松</td>
    <td>市场部</td>
    </tr>
    </table>
  </body>
</html>

你可能感兴趣的:(javascript实现复选框全选功能)