大家在使用邮箱收发邮件时通常会使用这么一个批量操作,比如将第n页所有旧的邮件全部删除,
大部分mail程序都提供了 这样一个功能——全选复选框checkbox,当你点击全选前面的复选框时,会
中所有的复选框。很人性化,很便捷的一个操作,那么它的工作原理是怎样的呢?其实也蛮简单的,有以下几个步骤:
1.通过脚本获取指定的元素集合,其实就是所有的复选框组成的一个数组,把这个数组对象保存到一个变量里。
2.使用for语句遍历数组对象,同时给数组中的每个元素添加上单击的选中事件checked,这样所有的复选框就被选中了。
下面是具体代码(提示:您可以复制代码内容保存到记事本里,并修改后缀名为.htm即可看到效果):
- <html>
- <head>
- <script type="text/javascript" language="javascript">
- function checkAll(o) {
- var mytable = document.getElementById("table1").getElementsByTagName("input");
- for(var i=1,ci;ci=mytable[i++];) {
- ci.checked = o.checked;
- }
- }
- </script>
- </head>
- <body>
- <table id="table1">
- <tr>
- <th><input type='checkbox' onclick='javascript: checkAll(this)'>全选</th>
- </tr>
- <tr>
- <td><input type='checkbox'></td>
- </tr>
- <tr>
- <td><input type='checkbox'></td>
- </tr>
- <tr>
- <td><input type='checkbox'></td>
- </tr>
- <tr>
- <td><input type='checkbox'></td>
- </tr>
- </table>
- </body>
- </html>