怎么样才能重置file框

邵天强

本帖最后由郭俊于 2013-7-21 11:48 编辑

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>网页布局的验证</title>
<script type="text/javascript">
//验证表单不能为空
function validateForm(){
//验证用户名
var usernameNode = byId("username");
//判断值是否为空
if ("" == usernameNode.value) {
alert("用户名不能为空");
//获得焦点
usernameNode.focus();
return ;
}
//验证密码
var passwordNode = byId("password");
if ("" == passwordNode.value) {
alert("密码不能为空");
//获得焦点
passwordNode.focus();
return ;
}
//性别不能为空，怎么做
var sexs = byName("sex");
//定义统计变量
var sexCount = 0;
for (var x = 0; x < sexs.length; x++) {
if (sexs[x].checked) {
sexCount++;
}
}
if (sexCount == 0) {
alert("请选择性别");
return ;
}
//爱好不能为空
var likes = byName("likes");
var likeCount = 0;
for (var x = 0; x < likes.length; x++) {
if (likes[x].checked) {
likeCount++;
}
}
if (likeCount == 0) {
alert("请选择爱好");
return ;
}
//判断下拉框
var provinceNode = byId("province");
if ("none" == provinceNode.value) {
alert("请选择省份");
provinceNode.focus();
return ;
}
//判断个人介绍
var myselfNode = byId("myself");
if(""==myselfNode.value)
{
alert("个人介绍不能为空");
myselfNode.focus();
return ;
}
//判断图片框
var fileNode = byId("file");
if(""==fileNode.value)
{
alert("上传图片不能为空");
fileNode.focus();
return ;
}
//最后我在这里进行提交
//获取表单form的名称
var formNode = byId("myform");
//更改服务器的地址
formNode.action = "test.html";
//提交表单
formNode.submit();
}
//根据id得到对象
function byId(id)
{
return document.getElementById(id);
}
//根据name得到对象数组
function byName(name)
{
return document.getElementsByName(name);
}
function resetEvent()
{
//用户名
byId("username").value="";
//密码
byId("password").value="";
//性别
byId("man").checked = false;
byId("woman").checked = false;
//爱好
byId("study").checked = false;
byId("think").checked = false;
byId("test").checked = false;
//省份
byId("province").value = "none";
//个人介绍
byId("myself").value = "";
<b><u><i>byId("file").outerHTML = "<input type='file' name='file' id='file'/>";</i></u></b>
}
</script>
</head>
<body>
<form action="success.html" method="post" id="myform">
<table border="1" width="40%" align="center" background="mn.jpg">
<caption>用户注册</caption>
<tr>
<td width="30%">用户名:</td>
<td width="70%"><input type="text" name="username" id="username" /></td>
</tr>
<tr>
<td>密码:</td>
<td><input type="password" name="password" id="password" /></td>
</tr>
<tr>
<td>性别:</td>
<td>
<input type="radio" name="sex" id="man" value="男" />男
<input type="radio" name="sex" id="woman" value="女" />女
</td>
</tr>
<tr>
<td>爱好:</td>
<td>
<input type="checkbox" name="likes" id="study" value="学习" />学习
<input type="checkbox" name="likes" id="think" value="思考" />思考
<input type="checkbox" name="likes" id="test" value="练习"/>练习
</td>
</tr>
<tr>
<td>省份:</td>
<td>
<select name="province" id="province">
<option value="none">--请选择--</option>
<option value="湖北省">湖北省</option>
<option value="湖南省">湖南省</option>
<option value="山东省">山东省</option>
<option value="山西省">山西省</option>
</select>
</td>
</tr>
<tr>
<td valign="top">个人介绍:</td>
<td>
<textarea name="myself" id="myself" rows="10" cols="40"></textarea>
</td>
</tr>
<tr>
<td>上传图片:</td>
<td><input type="file" name="file" id="file"/></td>
</tr>
<tr>
<td colspan="2" align="center">
<input type="button" value="注册" onclick="validateForm()" />
<input type="button" value="重置" onclick="resetEvent()" />
</td>
</tr>
</table>
</form>
</body>
</html>

复制代码

这个重置按钮，重置图片除了这种做法还有别的吗？

罗利华 · 罗利华

可以的，你在javascript中定义的resetEvent()函数删除，
把这句代码<input type="button" value="重置" onclick="resetEvent()" />
修改为：<input type="reset" value="重置" />就行了，
type指定类型为reset，它是意思就是清除表单中所有的数据。

郭俊 · 郭俊

修心者发表于 2013-1-6 16:52
可以的，你在javascript中定义的resetEvent()函数删除，
把这句代码
修改为：就行了，

嗯可以的谢谢啊

罗利华 · 罗利华

郭俊发表于 2013-1-6 18:34
嗯可以的谢谢啊

不用客气，

帐号		自动登录	找回密码
密码			加入黑马

怎么样才能重置file框

评分

3 个回复

评分