解析使用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 相关文章推荐
再谈IE中Flash控件的自动激活 ObjectWrap
Mar 09 Javascript
javascript之函数直接量(function(){})()
Jun 29 Javascript
Javascript学习笔记之函数篇(六) : 作用域与命名空间
Nov 23 Javascript
详细解密jsonp跨域请求
Apr 15 Javascript
jQuery无刷新分页完整实例代码
Oct 27 Javascript
关于Javascript回调函数的一个妙用
Aug 29 Javascript
JavaScript严格模式详解
Jan 16 Javascript
js实现倒计时关键代码
May 05 Javascript
用node-webkit把web应用打包成桌面应用(windows环境)
Feb 01 Javascript
JS实现为动态创建的元素添加事件操作示例
Mar 17 Javascript
jQuery实现聊天对话框
Feb 08 jQuery
JS实现购物车基本功能
Nov 08 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
?生?D片??C字串
2006/12/06 PHP
浅析PHP类的反射来实现依赖注入过程
2018/02/06 PHP
PHP addAttribute()函数讲解
2019/02/03 PHP
javascript 异步页面查询实现代码(asp.net)
2010/05/26 Javascript
分享8款优秀的 jQuery 加载动画和进度条插件
2012/10/24 Javascript
JQuery操作iframe父页面与子页面的元素与方法(实例讲解)
2013/11/20 Javascript
js原型继承的两种方法对比介绍
2014/03/30 Javascript
javascript定义变量时有var和没有var的区别探讨
2014/07/21 Javascript
BootStrap中的table实现数据填充与分页应用小结
2016/05/26 Javascript
BootStrap中Tab页签切换实例代码
2016/05/30 Javascript
浅谈Javascript中的12种DOM节点类型
2016/08/19 Javascript
jQuery UI Grid 模态框中的表格实例代码
2017/04/01 jQuery
详解使用Next.js构建服务端渲染应用
2018/07/10 Javascript
实例分析编写vue组件方法
2019/02/12 Javascript
使用Angular material主题定义自己的组件库的配色体系
2019/09/04 Javascript
如何利用node.js开发一个生成逐帧动画的小工具
2019/12/01 Javascript
[45:17]DOTA2-DPC中国联赛定级赛 Phoenix vs DLG BO3第三场 1月9日
2021/03/11 DOTA
使用Python简单的实现树莓派的WEB控制
2016/02/18 Python
Python中类的初始化特殊方法
2017/12/01 Python
详解Python if-elif-else知识点
2018/06/11 Python
Django分页查询并返回jsons数据(中文乱码解决方法)
2018/08/02 Python
Python识别快递条形码及Tesseract-OCR使用详解
2019/07/15 Python
pycharm编写spark程序,导入pyspark包的3中实现方法
2019/08/02 Python
Python xmltodict模块安装及代码实例
2020/10/05 Python
Django 权限管理(permissions)与用户组(group)详解
2020/11/30 Python
Python基于Faker假数据构造库
2020/11/30 Python
使用css3和jquery实现可伸缩搜索框
2014/02/12 HTML / CSS
详解Html5中video标签那些属性和方法
2019/07/01 HTML / CSS
浅谈Html5移动端ios/Android兼容性总结
2018/06/01 HTML / CSS
英国和爱尔兰的自炊式豪华度假小屋:Rural Retreats
2018/06/08 全球购物
英国票务网站:Ticketmaster英国
2018/08/27 全球购物
一帮一活动总结
2014/05/08 职场文书
自愿离婚协议书2015
2015/01/26 职场文书
客户经理岗位职责
2015/01/31 职场文书
创业者如何撰写出一份打动投资人的商业计划书?
2019/07/02 职场文书
关于MySQL中的 like操作符详情
2021/11/17 MySQL