Go homepage(回首页)
Upload pictures (上传图片)
Write articles (发文字帖)

The author:(作者)操作成功
published in(发表于) 2013/5/7 7:18:28
ASP.Net中FileUpLoad控件内容清空

ASP.Net中FileUpLoad控件内容清空

对于file值是只读的,我们没有办法去改变它,不过一些变相的方法还是可以的。

方法一:

上传控件基础知识说明:

上传控件()用于在客户端浏览并上传文件,用户选取的路径可以由value属性获取,但value属性是只读的,不能通过javascript来赋值,这就使得不能通过value=""语句来清空它。很容易理解为什么只读,如果可以随意赋值的话,那么用户只要打开你的网页,你就可以随心所欲的上传他电脑上的文件了,呵呵,毕竟表单的submi是可以随便调用的。

而上传控件又没有一个clear()之类的函数,所以这使得无刷新上传文件显得稍稍不爽,尤其对于追求完美的开发者而言。然而今天在做一个Asp.net控件时却发现不得不需要清空一下上传控件,于是便开始想办法。网上搜索一番,不出所料,没有找到什么结果。关键时刻只能靠自己了。

仔细想想,上传控件是不是任何时候都不可能被清空呢?答案是否,form.reset()方法能够重置所有得表单元素。只要调用inputFile.form.reset(),那么上传控件的值就清空了,不要担心它被恢复为某个默认值,value是只读的,你不能为它设置某个初始值。

于是开始设想,如果我只需要reset一下上传控件,怎么解决?其他的表单元素要保持原状。一个可行的方法是,reset之前获取所有的表单域的值,之后再用这些值填充,虽然显得稍微复杂,但借助prototype框架的Form对象提供的方法,还是很容易做到的。这样就能够得到需要的结果了。

然而这个方法还是不够优雅,沿着思路继续想下去,不难得到改进的方法:创建一个新的form,把上传控件临时放过来,再调用这个form的reset方法,完工之后再把上传控件弄回去。这个form无需进入DOM结构便能正常工作,所以不用担心会对界面有任影响。下面给出函数实现,经过验证工作良好,呵呵。

程序代码
//清空文件上传框
function clearFileInput(file){
var form=document.createElement('form');
document.body.appendChild(form);
//记住file在旧表单中的的位置
var pos=file.nextSibling;
form.appendChild(file);
form.reset();
pos.parentNode.insertBefore(file,pos);
document.body.removeChild(form);
}


方法2 用这个方法不能保存input的样式


比较简单了 重新建立个 file 就可以了。


程序代码





方法3,用这个方法可以保存input的样式

(end)





If you have any requirements, please contact webmaster。(如果有什么要求,请联系站长)





QQ:154298438
QQ:417480759