您的位置:首页 > Web前端 > JavaScript

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

2012-03-13 16:53 253 查看
代码如下:

<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> </TD>

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

<TD> </TD>

</TR>

</FORM>

</TABLE>

运行效果:



选中两项:



点击反选:



点击全选:



删除确认:



未选择提示:

内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: