本文介绍了一个简单的HTML表单，使用JavaScript实现全选、反选及全不选的功能。通过操作带有复选框的表格来演示如何利用JavaScript进行DOM操作。
<html>
<head><table>
<tr>
<td><input type="checkbox" name="fuxuan1"></td>
<td>胖嘟嘟</td>
<td>2013-2-26</td>
</tr>
<tr>
<td><input type="checkbox" name="fuxuan1"></td>
<td>冯猪猪</td>
<td>2013-2-27</td>
</tr>
<tr>
<td><input type="checkbox" name="fuxuan1"></td>
<td>其他</td>
<td>2013-2-28</td>
</tr>
<tr>
<td><input type="button" value="全选" onclick="all()"></td>
<td><input type="button" value="反选" onclick="none()"></td>
<td><input type="button" value="全不选" onclick="no()"></td>
</tr>
</table></head>
<script>
function all()
{
for(i=0;i<document.getElementsByName("fuxuan1").length;i++)
{
document.getElementsByName("fuxuan1")[i].checked = "checked";
}
}
function no()
{
for(i=0;i<document.getElementsByName("fuxuan1").length;i++)
{
document.getElementsByName("fuxuan1")[i].checked = false;
}
}
function none()
{
for(i=0;i<document.getElementsByName("fuxuan1").length;i++)
{
if(document.getElementsByName("fuxuan1")[i].checked == false)
{
document.getElementsByName("fuxuan1")[i].checked = "checked";
}
else document.getElementsByName("fuxuan1")[i].checked = false;
}
}
</script>
</html>
扫一扫
272
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
