解析使用JS 清空File控件的路径值


Posted in Javascript onJuly 08, 2013

1.关于如何用脚本修改fileupload控件值的问题,

开发环境vs2005,在上传文件时,需要一个取消的按钮来清空type=file的value,而且这个页面上有多个file控件

这个比较麻烦因为file的值本身是不允许用脚本修改的(安全角度考虑)

方法1).使用脚本把这个file的input移动到一个form中,然后调用reset,如果有多个这样的input当然还要再移出来.这个方法我不会采用,因为对.net开发者

来讲习惯了一个页面就一个form所有控件都在其中.

方法2).这个方法有点投机,就是在脚本中调用
var fileup = document.getElementById(fileid);
fileup.outerHTML = fileup.outerHTML; 这个ie对脚本处理以及展现机制有关

方法3).这个主要是在解决ff上的问题时考虑到的,其实就是重新生成了一个id相同的file,这里要注意 name一定也要赋值,否则是很难提交给服务器接受的

在平时项目开发中会有上传文件的功能,一般在前端会通过JS来判断上传文件是否属于指定的文件类型,如果不属于就将控件值清空! (当然你也可以不清空)

有一种方法可以很简单的装文件上传组件的值清空,代码如下:
var file=document.getElementById("form1:fileupload");
file.outerHTML=file.outerHTML

以上方法之能在IE中使用
为了兼容FireFox我们使用下面的方式来清空fileupload控件的值:
<span id='uploadSpan'>
<input type="file">
</span>
<script language="JavaScript">
var html=document.getElementById('uploadSpan').innerHTML;
function resetFile(){
document.getElementById('uploadSpan').innerHTML=html;
}
</script>
这样就行了,各浏览器都支持的

Javascript 相关文章推荐
firefox 和 ie 事件处理的细节,研究,再研究 书写同时兼容ie和ff的事件处理代码
Apr 12 Javascript
javascript检查日期格式的函数[比较全]
Oct 17 Javascript
项目中常用的JS方法整理
Jan 30 Javascript
C++中的string类的用法小结
Aug 07 Javascript
JavaScript仿支付宝密码输入框
Dec 29 Javascript
jQuery实现从身份证号中获取出生日期和性别的方法分析
Feb 25 Javascript
JavaScript模板引擎Template.js使用详解
Dec 15 Javascript
Jquery Easyui表单组件Form使用详解(30)
Dec 19 Javascript
如何获取vue单文件自身源码路径
May 06 Javascript
vue项目中使用vue-layer弹框插件的方法
Mar 11 Javascript
解决qrcode.js生成二维码时必须定义一个空div的问题
Jul 09 Javascript
javascript代码实现简易计算器
Jan 25 Javascript
使用JS 清空File控件的路径值
Jul 08 #Javascript
JS 修改URL参数(实现代码)
Jul 08 #Javascript
解析javascript系统错误:-1072896658的解决办法
Jul 08 #Javascript
浅谈JavaScript之事件绑定
Jul 08 #Javascript
JS Map 和 List 的简单实现代码
Jul 08 #Javascript
利用JS实现浏览器的title闪烁
Jul 08 #Javascript
利用js实现遮罩以及弹出可移动登录窗口
Jul 08 #Javascript
You might like
简单的用PHP编写的导航条程序
2006/10/09 PHP
php中处理mysql_fetch_assoc返回来的数组 不用foreach----echo
2011/05/04 PHP
PHP+Ajax实现验证码的实时验证
2016/07/20 PHP
javascript 文件的同步加载与异步加载实现原理
2012/12/13 Javascript
javascript中expression的用法整理
2014/05/13 Javascript
jQuery中[attribute]选择器用法实例
2014/12/31 Javascript
js 求时间差的实现代码
2016/04/26 Javascript
jquery.serialize() 函数语法及简单实例
2016/07/08 Javascript
js给table赋值的实例代码
2016/10/13 Javascript
解决拦截器对ajax请求的拦截实例详解
2016/12/21 Javascript
深入掌握 react的 setState的工作机制
2017/09/27 Javascript
详解vuejs中执行npm run dev出现页面cannot GET/问题
2020/04/26 Javascript
[04:29]【TI9采访】OG.N0tail在胜者组决赛后接受采访
2019/08/25 DOTA
[01:19:46]EG vs Secret 2019国际邀请赛淘汰赛 胜者组 BO3 第二场 8.21.mp4
2020/07/19 DOTA
Python自动重试HTTP连接装饰器
2015/04/28 Python
python Django批量导入数据
2016/03/25 Python
Python模拟简单电梯调度算法示例
2018/08/20 Python
Pytest参数化parametrize使用代码实例
2020/02/22 Python
Python Tornado实现WEB服务器Socket服务器共存并实现交互的方法
2020/05/26 Python
基于Python实现体育彩票选号器功能代码实例
2020/09/16 Python
浅析Python 中的 WSGI 接口和 WSGI 服务的运行
2020/12/09 Python
详解如何使用CSS3中的结构伪类选择器和伪元素选择器
2020/01/06 HTML / CSS
html5 input元素新特性_动力节点Java学院整理
2017/07/06 HTML / CSS
Lancome兰蔻官方旗舰店:来自法国的世界知名美妆品牌
2018/06/14 全球购物
捷克厨房用品购物网站:Tescoma
2018/07/13 全球购物
团支书的期末学习总结自我评价
2013/11/01 职场文书
单位刻章介绍信范文
2014/01/11 职场文书
单位领导证婚词
2014/01/14 职场文书
医科大学毕业生自荐信
2014/02/03 职场文书
药学专业学生的自我评价分享
2014/02/06 职场文书
买房委托公证书
2014/04/08 职场文书
运动会演讲稿300字
2014/08/25 职场文书
领导批评与自我批评范文
2014/10/16 职场文书
复试通知单模板
2015/04/24 职场文书
给朋友的赠语
2015/06/23 职场文书
导游词之天津盘山
2019/11/01 职场文书