现在的位置: 首页 > 综合 > 正文

关于上传控件的清空

2012年11月24日 ⁄ 综合 ⁄ 共 1036字 ⁄ 字号 评论关闭

有时候页面有很多上传控件的时候,要reset某个上传控件比较头痛,因为不能用form.reset,这里我想到一个变通的方法来解决

原理是将控件移动到一个隐藏表单中,reset后再移回来,请看下面完整的示例.html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
<head>
 <title>Demo</title>
<script>
function ResetFileCtrl(ctrl)
{
 var hiddenForm = document.getElementById("hiddenResetForm");
 var oTemp = document.createElement("<DIV id=tempResetPos>dd</DIV>");
 ctrl.parentNode.insertBefore(oTemp, ctrl);
 hiddenForm.appendChild(ctrl);
 hiddenForm.reset();
 hiddenForm.removeChild(ctrl); 
 oTemp.parentNode.insertBefore(ctrl,oTemp);
 oTemp.parentNode.removeChild(oTemp);
}
</script>
</head>

<body>
<input type="file" id="f" /><input type="button" id="b" onclick="ResetFileCtrl(f);" value="Reset1" />
<input type="button" value="test1" onclick="alert(f.value);" /> <br>
<input type="file" id="f2" /><input type="button" id="b" onclick="ResetFileCtrl(f2);" value="Reset2" />
<input type="button" value="test2" onclick="alert(f2.value);" />

   <form id="hiddenResetForm" style="display:none"></form>
</body>
</html>

使用时只用注意调用ResetFileCtrl方法,并给body增加一个隐藏表单。代码已测试。注意inertbefore兼容ie和ff,但是ie需要6.0+

抱歉!评论已关闭.