IE type=file上传文件浏览弹窗问题
2014-04-03 08:38
525 查看
今天碰到一个问题,IE上传文件浏览不能弹窗。
原因与内嵌的框架相关(内部框架),导致不能正常弹出选择文件的窗口。
刚开始查找了很多相关IE上传文件问题,但基本没有出现这种弹窗问题,基本都是可以弹窗,但上传不了。
自己做了个简单的<input type="file" value=“test” />在IE各个版本测试,完全没有问题,证实了与本身代码无关,主要是框架与浏览器的兼容性不怎么好。
出现的现象:打开WebDevelper,在Event log 下查看,触发了事件,居然时而可弹窗,时而不可弹窗,未果。只能另找方法。
在网上也看了其他的各种方法,其中障眼法最可以解决。就是用一个a标签套住input标签,点击a标签从而触发点击input弹窗标签,再做一下样式修改即可。
虽然解决了弹窗问题,可是居然上传功能也就跟着失效了,报了“拒绝访问”错误。查了原因,结果得到的答案是:
http://www.qttc.net/201305334.html
/article/9276260.html
解决方案是让file标签盖在a标签上,但file是透明的,这样用户看到的是a标签的外观,实际点击是file标签。
顺便也发了帖询问是否可以屏蔽这个安全机制,未果。(有人答:file reader可以解决,后面因找到框架与IE中file兼容的原因而没继续研究下去。)
原因与内嵌的框架相关(内部框架),导致不能正常弹出选择文件的窗口。
刚开始查找了很多相关IE上传文件问题,但基本没有出现这种弹窗问题,基本都是可以弹窗,但上传不了。
自己做了个简单的<input type="file" value=“test” />在IE各个版本测试,完全没有问题,证实了与本身代码无关,主要是框架与浏览器的兼容性不怎么好。
出现的现象:打开WebDevelper,在Event log 下查看,触发了事件,居然时而可弹窗,时而不可弹窗,未果。只能另找方法。
在网上也看了其他的各种方法,其中障眼法最可以解决。就是用一个a标签套住input标签,点击a标签从而触发点击input弹窗标签,再做一下样式修改即可。
虽然解决了弹窗问题,可是居然上传功能也就跟着失效了,报了“拒绝访问”错误。查了原因,结果得到的答案是:
“IE下 file必须用户触发事件(安全机制,不能用js控制打开文件选择器),选择上传文件。不然就是报拒绝访问。”
继续寻找解决方法:
http://www.qttc.net/201305334.html
/article/9276260.html
解决方案是让file标签盖在a标签上,但file是透明的,这样用户看到的是a标签的外观,实际点击是file标签。
顺便也发了帖询问是否可以屏蔽这个安全机制,未果。(有人答:file reader可以解决,后面因找到框架与IE中file兼容的原因而没继续研究下去。)
相关文章推荐
- 解决美化后的文件上传控件(type=file),IE和firefox不兼容的问题
- js或者JQ的focus和select失效问题和input type=file上传文件问题
- 解决在Safari、IE高版本中采用自定义选择文件按钮ajaxFileUpload不能上传问题
- [置顶]关于使用input type=file 标签上传文件的注意细节(上传文件 无法获取文件 问题)
- 解决JS(Vue)input[type='file'] change事件无法上传相同文件的问题
- 浏览选择上传文件的控件 input type=file
- 解决<input type=“file” multiple> 多文件上传问题(可以多次选取文件,也可以一次选取多个文件),而且点击的是一个同一个div
- 通过<input type=“file”>上传文件问题
- struts中post方式上传文件,enctype="multipart/form-data",request.getParameter("file") 是null的问题分析
- IE input type=file 隐藏时不能上传文件
- 浏览器兼容性: PHP文件上传在IE和FF中$_FILES['userfile']['type']的表现形式
- file 标签上传文件,直接样式太难看!隐藏它,通过别的按钮触发它,又会有IE兼容问题。
- input type file onchange上传文件的过程中,遇到同一个文件二次上传无效的问题。
- 关于使用input type=file 标签上传文件的注意细节(上传文件 无法获取文件 问题)
- 在IE中必须点击input file 控件的浏览按钮才能提交上传,否则没有权限 。js文件报拒绝访问,解决办法是将input file控件定位到你要点击的地方 ,并且input file做成透明的
- ajaxfileupload上传文件,返回json数据报错的问题。 Resource interpreted as Document but transferred with MIME type ap
- <input type="file">定义样式并获取上传文件路径及指定文件类型
- Android:让WebView支持<input type="file"…>元素,实现文件上传
- spring mvc 下使用ajaxfileupload.js 异步上传文件 并返回信息 各种问题解决
- jquery 文件上传插件ajaxfileupload.js 实现多图上传,解决文件上传后表单置空的问题