用JS完成复选框checkbox的全选\反选\删除确认

 

代码如下:

<SCRIPT LANGUAGE="JavaScript">

<!--

     //check函数检测是否选中文章

function check(oj)

{

            var d=false; //定义一个标志符

               for (var i=0;i<oj.length;i++ )

               {

                if (oj[i].checked)

                      {

                         d=true;

                       }

               }

      //用循环判断是否有文章被选中

              if (d)

           {

               var f=confirm("确定要删除所选吗？");//确信是否删除；

               if (f)

              {

                return true; //确信删除；

              }

              else

              {

               return false; //不删除；

              }

           }

             else

              {

                alert("请选择要删除的文章！");//未选中，进行提示

                return false;

              }

}

//checkall为设置全选

function checkall(oj)

{

      for (var i=0;i<oj.length;i++ )

            {

              oj[i].checked=true;

            }

}

    //checkback为设置反选

     function checkback(oj)

{

      for (var i=0;i<oj.length;i++ )

            {

              if (oj[i].checked)

              {

               oj[i].checked=false;

              }

     else

     {

     oj[i].checked=true;

     }

            }

}

//-->

</SCRIPT>

<CENTER><H2>文章管理</H2></CENTER>

   <TABLE align="center" width="400" border="1">

   <FORM METHOD="POST" ACTION="" name="myform" onsubmit="return check(document.myform.del);">

<TR>

<TD><INPUT TYPE="checkbox" NAME="del" value="1"></TD>

<TD>关于大学生的就业问题？</TD>

<TD>编辑</TD>

   </TR>

   <TR>

<TD><INPUT TYPE="checkbox" NAME="del" value="2"></TD>

<TD>07年师范生不收学费？</TD>

<TD>编辑</TD>

   </TR>

   <TR>

<TD><INPUT TYPE="checkbox" NAME="del" value="3"></TD>

<TD>人类文明正在遭受到侵犯</TD>

<TD>编辑</TD>

   </TR>

   <TR>

<TD><INPUT TYPE="checkbox" NAME="del" value="4"></TD>

<TD>古龙小说中的爱情</TD>

<TD>编辑</TD>

   </TR>

   <TR>

<TD>&nbsp;</TD>

<TD align="center"><INPUT TYPE="button" value="全选" onclick="checkall(document.myform.del)">&nbsp;&nbsp;<INPUT TYPE="button" value="反选" onclick="checkback(document.myform.del)">&nbsp;&nbsp;<INPUT TYPE="submit" value="删除">&nbsp;&nbsp;<INPUT TYPE="reset" value="重选"></TD>

<TD>&nbsp;</TD>

   </TR>

   </FORM>

   </TABLE>

运行效果:

选中两项:

点击反选:

点击全选:

删除确认:

未选择提示: