实现复选框的全选和反选

实现复选框的全选和反选

 <!--[endif]-->

//实现全选功能

function CheckAll(elements) {

              for (i = 0; i < elements.length; i++) { //通过for循环将全部复选框设置为选中状态

                     elements[i].checked = true; //设置当前复选框为选中状态

              }

       }

       //实现反选功能

       function CheckInverse(elements) {

              for (i = 0; i < elements.length; i++) { //通过for循环将遍历全部复选框

                     if (elements[i].checked == true) { //判断当前复选框是否为选中状态

                            elements[i].checked = false; //设置当前复选框为非选中状态

                     } else {

                            elements[i].checked = true; //设置当前复选框为选中状态

                     }

              }

       }

 

<form name="form1" method="post" action="">

                     <table width="300" border="1" cellspacing="0" cellpadding="0"

                            bordercolor="#000000" bordercolordark="#666666"

                            bordercolorlight="#FFFFFF">

                            <tr>

                                   <td width="44" height="25" align="center">

                                          <input name="delId" type="checkbox" id="delId" value="1">

                                   </td>

                                   <td width="109">

                                          &nbsp;明日科技

                                   </td>

                                   <td width="147">

                                          &nbsp;超级管理员

                                   </td>

                            </tr>

                            <tr>

                                   <td height="25" align="center">

                                          <input name="delId" type="checkbox" id="delId" value="2">

                                   </td>

                                   <td>

                                          &nbsp;柠檬草

                                   </td>

                                   <td>

                                          &nbsp;普通管理员

                                   </td>

                            </tr>

                            <tr>

                                   <td height="25" align="center">

                                          <input name="delId" type="checkbox" id="delId" value="3">

                                   </td>

                                   <td>

                                          &nbsp;gk

                                   </td>

                                   <td>

                                          &nbsp;普通会员

                                   </td>

                            </tr>

                            <tr>

                                   <td height="25" align="center">

                                          <input name="delId" type="checkbox" id="delId" value="4">

                                   </td>

                                   <td>

                                          &nbsp;sk

                                   </td>

                                   <td>

                                          &nbsp;普通会员

                                   </td>

                            </tr>

                     </table>

                     <table width="300" border="0" cellspacing="0" cellpadding="0">

                            <tr>

                                   <td width="100%" height="30" align="right">

                                          [

                                          <span><a href="#" onClick="CheckAll(form1.delId)"

                                                 style="color: #FF0000;">全选</a>/ <a href="#"

                                                 onClick="CheckInverse(form1.delId)" style="color: #FF0000;">反选</a>

                                          </span>]

                                   </td>

                            </tr>

                     </table>

              </form>