formData文件上传兼容IE8

最新推荐文章于 2024-08-12 09:54:37 发布

junyunKang

最新推荐文章于 2024-08-12 09:54:37 发布

阅读量2.6k

点赞数

分类专栏： IE兼容文章标签： IE8兼容

本文链接：https://blog.csdn.net/junyunKang/article/details/103403538

版权

在XP系统IE8浏览器中，面临iframe内文件上传的兼容性挑战。文章介绍了使用webupload时，由于IE8的Flash限制导致的模拟点击无效问题，以及使用jquery.form时因JavaScript控制file输入框引发的"拒绝访问"错误。最终解决方案是通过手动创建覆盖input=file的按钮，利用事件穿透来触发文件选择器。

摘要由CSDN通过智能技术生成

场景：XP环境IE8版本的浏览器，在iframe内文件上传

问题：

1、使用webupload

在ie8下模拟点击打开文件选择器，按钮点击无反应。

查阅资料后，得知原因是webupload在ie8下使用的是flash显示，不存在input文件选择，所以模拟点击无效。

手动直接点击打开文件选择器，第二次点击按钮无反应。

查阅资料后，发现webupload选择器放在datagrid表格里，两个插件可能存在相互影响，造成功能不完美，所以果断放弃。

2、使用jquery.form

在ie8下使用模拟点击打开文件选择器，提示“拒绝访问”。

查阅资料后，得知原因是IE下 file表单控件，不能用js控制打开文件选择器，必须要手动点击才可以，否则会报 “拒绝访问”。

所以在datagrid单元格内，手动写一个按钮覆盖input=file，同时点击事件穿透到input=file上面来打开文件选择器。

解决方案：

手动写一个按钮覆盖input=file，同时点击事件穿透到input=file上面来打开文件选择器。

3、代码展示：


/* 选择文件按钮化a */
.a-upload {
    position: relative;
    padding: 0 10px;
    height: 30px;
    line-height: 30px;
    cursor: pointer;
    color: #fff;
    background: #0094F5;
    border-radius: 3px;
    overf