checkbox 或者按钮实现 form 内的 checkbox 全选或者反选，代码很简单，全部代码如下：
- <html>
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
- <title>check test</title>
- </head>
- <body>
- <form name="formGroup" id="formGroup" action="#" method="post" target="_self">
- <table border="1" cellpadding="2" cellspacing="1" class="table_hide">
- <tr class="table_title">
- <td width="50" align="center" class="text_center">序号</td>
- <td width="40" align="center" class="text_center">选择</td>
- <td width="100" align="center"></td>
- <td width="100" align="center"></td>
- </tr>
- <tr>
- <td align="center" class="text_center">1</td>
- <td align="center" class="text_center"><input name="groupCheckbox" type="checkbox" value="" class="input_hide"></td>
- <td align="center"></td>
- <td align="center"></td>
- </tr>
- <tr>
- <td align="center" class="text_center">2</td>
- <td align="center" class="text_center"><input name="groupCheckbox" type="checkbox" value="" class="input_hide"></td>
- <td align="center"></td>
- <td align="center"></td>
- </tr>
- <tr>
- <td align="center" class="text_center">3</td>
- <td align="center" class="text_center"><input name="groupCheckbox" type="checkbox" value="" class="input_hide"></td>
- <td align="center"></td>
- <td align="center"></td>
- </tr>
- <tr>
- <td align="center">全选</td>
- <!-- 复选框单击方式 -->
- <td align="center"><input name="" type="checkbox" class="input_hide" onClick="CheckSelect(this.form);return false;" value=""></td>
- <!-- 按钮方式，本质无区别 -->
- <td align="center"><input name="" type="button" class="input_hide" onClick="CheckSelect(this.form);return false;" value="选/反选"></td>
- <td align="center"></td>
- </tr>
- </table>
- </form>
- </body>
- <script type="text/javascript">
- // 选择或者反选 checkbox
- function CheckSelect(thisform)
- {
- // 遍历 form
- for ( var i = 0; i < thisform.elements.length; i++)
- {
- // 提取控件
- var checkbox = thisform.elements[i];
- // 检查是否是指定的控件
- if (checkbox.name === "groupCheckbox" && checkbox.type === "checkbox" && checkbox.checked === false)
- {
- // 正选
- checkbox.checked = true;
- }
- else if (checkbox.name === "groupCheckbox" && checkbox.type === "checkbox" && checkbox.checked === true)
- {
- // 反选
- checkbox.checked = false;
- }
- }
- }
- </script>
- </html>
效果演示