最近做的一个小功能,需要清空的值,但上传控件的值不能通过JavaScript来修改。
google找到这样一个解决方法:
在上传控件中插入了值,就只能通过form的reset功能来清空了,但是form里面其他的值也被reset了。
既然可以使用form的reset清空,那就有办法了:新建一个临时form,然后将需要清空的上传控件移入其中,reset之后,再移回原来所在位置,最后删除创建的临时form。js代码:
-
var Upload = {
-
clear: function(id){
-
var up = (typeof id=="string")?document.getElementById(id):id;
-
if (typeof up != "object") return null;
-
var tt = document.createElement("span");
-
tt.id = "__tt__";
-
up.parentNode.insertBefore(tt,up);
-
var tf = document.createElement("form");
-
tf.appendChild(up);
-
document.getElementsByTagName("body")[0].appendChild(tf);
-
tf.reset();
-
tt.parentNode.insertBefore(up,tt);
-
tt.parentNode.removeChild(tt);
-
tt = null;
-
tf.parentNode.removeChild(tf);
-
},
-
clearForm: function(){
-
var inputs,frm;
-
if (arguments.length == 0)
-
{
-
inputs = document.getElementsByTagName("input");
-
}else{
-
frm = (typeof arguments[0] == "string")?document.getElementById(arguments[0]):arguments[0];
-
if (typeof frm != "object") return null;
-
inputs = frm.getElementsByTagName("input");
-
}
-
var fs=[];
-
for ( var i=0; i<inputs.length; i++ )
-
{
-
if (inputs[i].type == "file") fs[fs.length] = inputs[i];
-
}
-
var tf = document.createElement("form");
-
for ( var i=0; i<fs.length; i++ )
-
{
-
var tt = document.createElement("span");
-
tt.id = "__tt__" + i;
-
fs[i].parentNode.insertBefore(tt, fs[i]);
-
tf.appendChild(fs[i]);
-
}
-
document.getElementsByTagName("body")[0].appendChild(tf);
-
tf.reset();
-
for ( var i=0; i<fs.length; i++)
-
{
-
var tt = document.getElementById("__tt__" + i);
-
tt.parentNode.insertBefore(fs[i],tt);
-
tt.parentNode.removeChild(tt);
-
}
-
tf.parentNode.removeChild(tf);
-
}
-
}
-
view plaincopy to clipboardprint?
-
var Upload = {
-
clear: function(id){
-
var up = (typeof id=="string")?document.getElementById(id):id;
-
if (typeof up != "object") return null;
-
var tt = document.createElement("span");
-
tt.id = "__tt__";
-
up.parentNode.insertBefore(tt,up);
-
var tf = document.createElement("form");
-
tf.appendChild(up);
-
document.getElementsByTagName("body")[0].appendChild(tf);
-
tf.reset();
-
tt.parentNode.insertBefore(up,tt);
-
tt.parentNode.removeChild(tt);
-
tt = null;
-
tf.parentNode.removeChild(tf);
-
},
-
clearForm: function(){
-
var inputs,frm;
-
if (arguments.length == 0)
-
{
-
inputs = document.getElementsByTagName("input");
-
}else{
-
frm = (typeof arguments[0] == "string")?document.getElementById(arguments[0]):arguments[0];
-
if (typeof frm != "object") return null;
-
inputs = frm.getElementsByTagName("input");
-
}
-
var fs=[];
-
for ( var i=0; i<inputs.length; i++ )
-
{
-
if (inputs[i].type == "file") fs[fs.length] = inputs[i];
-
}
-
var tf = document.createElement("form");
-
for ( var i=0; i<fs.length; i++ )
-
{
-
var tt = document.createElement("span");
-
tt.id = "__tt__" + i;
-
fs[i].parentNode.insertBefore(tt, fs[i]);
-
tf.appendChild(fs[i]);
-
}
-
document.getElementsByTagName("body")[0].appendChild(tf);
-
tf.reset();
-
for ( var i=0; i<fs.length; i++)
-
{
-
var tt = document.getElementById("__tt__" + i);
-
tt.parentNode.insertBefore(fs[i],tt);
-
tt.parentNode.removeChild(tt);
-
}
-
tf.parentNode.removeChild(tf);
-
}
-
}
-
var Upload = {
-
clear: function(id){
-
var up = (typeof id=="string")?document.getElementById(id):id;
-
if (typeof up != "object") return null;
-
var tt = document.createElement("span");
-
tt.id = "__tt__";
-
up.parentNode.insertBefore(tt,up);
-
var tf = document.createElement("form");
-
tf.appendChild(up);
-
document.getElementsByTagName("body")[0].appendChild(tf);
-
tf.reset();
-
tt.parentNode.insertBefore(up,tt);
-
tt.parentNode.removeChild(tt);
-
tt = null;
-
tf.parentNode.removeChild(tf);
-
},
-
clearForm: function(){
-
var inputs,frm;
-
if (arguments.length == 0)
-
{
-
inputs = document.getElementsByTagName("input");
-
}else{
-
frm = (typeof arguments[0] == "string")?document.getElementById(arguments[0]):arguments[0];
-
if (typeof frm != "object") return null;
-
inputs = frm.getElementsByTagName("input");
-
}
-
var fs=[];
-
for ( var i=0; i<inputs.length; i++ )
-
{
-
if (inputs[i].type == "file") fs[fs.length] = inputs[i];
-
}
-
var tf = document.createElement("form");
-
for ( var i=0; i<fs.length; i++ )
-
{
-
var tt = document.createElement("span");
-
tt.id = "__tt__" + i;
-
fs[i].parentNode.insertBefore(tt, fs[i]);
-
tf.appendChild(fs[i]);
-
}
-
document.getElementsByTagName("body")[0].appendChild(tf);
-
tf.reset();
-
for ( var i=0; i<fs.length; i++)
-
{
-
var tt = document.getElementById("__tt__" + i);
-
tt.parentNode.insertBefore(fs[i],tt);
-
tt.parentNode.removeChild(tt);
-
}
-
tf.parentNode.removeChild(tf);
-
}
-
}
使用示例:
-
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "">
-
<html xmlns="">
-
<head>
-
<title>JS清空上传控件input(type="file")的值-www.jbxue.com</title>
-
<script type="text/javascript">
-
<!--引入以上js代码--></script>
-
</head>
-
<body>
-
<form name="testform" method="post">
-
<input type="file" name="testfile" />
-
<input type="button" value="clear" onclick="Upload.clear('testfile')" /><br />
-
<input type="button" value="clearAll" onclick="Upload.clearForm()" /><br />
-
<input type="submit" value="submit" /><input type="reset" value="reset" />
-
</form>
-
</body>
-
</html>
阅读(759) | 评论(0) | 转发(0) |