JS异步文件上传(兼容IE8+)


Posted in Javascript onApril 02, 2017

在非html5的情况下是无法用ajax把文件推送到后端的,只能通过form表单提交。但是form表单提交后浏览器会根据响应头与状态码对当前页面进行渲染、下载或跳转等行为,返回text、html、json等类型的内容时浏览器会对当前页面进行渲染,相当于刷新。

所以基本思路很简单,提交上传文件表单时,让浏览器转移到iframe处理响应信息,响应信息嵌入一段js代码,这段js代码调用当前页面的一个方法就可以实现回调,类似于xss攻击。

这时就要用到form表单的target属性,我们这里只需要用到iframename的值,iframename指的是iframe的name属性,意思是转移到iframe处理响应信息。

我这里用的是jsp + spring mvc的实现,代码如下

JS异步文件上传(兼容IE8+)

上传文件的JSP->demo.jsp

后端代码:

JS异步文件上传(兼容IE8+)

回调的JSP->uploadCallback.jsp  注意: 如果上传文件的页面不是顶级窗口,而是一个ifream 就要使用window.parent取得上传文件页面的window对象

JS异步文件上传(兼容IE8+)

效果:

JS异步文件上传(兼容IE8+)

JS异步文件上传(兼容IE8+)

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持三水点靠木!

Javascript 相关文章推荐
asp(javascript)全角半角转换代码 dbc2sbc
Aug 06 Javascript
动态加载外部javascript文件的函数代码分享
Jul 28 Javascript
jQuery可见性过滤器:hidden和:visibility用法实例
Jun 24 Javascript
BootStrap下拉框在firefox浏览器界面不友好的解决方案
Aug 18 Javascript
jquery实现轮播图效果
Feb 13 Javascript
react 父组件与子组件之间的值传递的方法
Sep 14 Javascript
浅谈Node.js 子进程与应用场景
Jan 24 Javascript
angular json对象push到数组中的方法
Feb 27 Javascript
JS实现简单获取最近7天和最近3天日期的方法
Apr 18 Javascript
分享vue里swiper的一些坑
Aug 30 Javascript
5分钟快速掌握JS中var、let和const的异同
Sep 19 Javascript
详解Vue一个案例引发「内容分发slot」的最全总结
Dec 02 Javascript
使用canvas及js简单生成验证码方法
Apr 02 #Javascript
jQuery插件FusionCharts绘制的3D环饼图效果示例【附demo源码】
Apr 02 #jQuery
JS中正则表达式全局匹配模式 /g用法详解
Apr 01 #Javascript
Vue表单验证插件的制作过程
Apr 01 #Javascript
JS中使用正则表达式g模式和非g模式的区别
Apr 01 #Javascript
如何选择jQuery版本 1.x? 2.x? 3.x?
Apr 01 #jQuery
微信小程序网络请求的封装与填坑之路
Apr 01 #Javascript
You might like
第五节--克隆
2006/11/16 PHP
Php图像处理类代码分享
2012/01/19 PHP
phpmyadmin提示The mbstring extension is missing的解决方法
2014/12/17 PHP
PHP中error_log()函数的使用方法
2015/01/20 PHP
Symfony2安装第三方Bundles实例详解
2016/02/04 PHP
Codeigniter中集成smarty和adodb的方法
2016/03/04 PHP
原生JS实现Ajax通过POST方式与PHP进行交互的方法示例
2018/05/12 PHP
奉献给JavaScript初学者的编写开发的七个细节
2011/01/11 Javascript
javascript 函数声明与函数表达式的区别介绍
2013/10/05 Javascript
javascript 判断字符串是否包含某字符串及indexOf使用示例
2013/10/18 Javascript
JQuery异步加载无限下拉框级联功能实现示例
2014/02/19 Javascript
详解jQuery的Cookie插件
2016/11/23 Javascript
ES6字符串模板,剩余参数,默认参数功能与用法示例
2017/04/06 Javascript
浅谈jquery中ajax跨域提交的时候会有2次请求的问题
2017/11/10 jQuery
深入浅出理解JavaScript闭包的功能与用法
2018/08/01 Javascript
TypeScript中的方法重载详解
2019/04/12 Javascript
vue如何使用async、await实现同步请求
2019/12/09 Javascript
JS数组的高级使用方法示例小结
2020/03/14 Javascript
微信小程序实现canvas分享朋友圈海报
2020/06/21 Javascript
vue添加锚点,实现滚动页面时锚点添加相应的class操作
2020/08/10 Javascript
[01:20:47]DOTA2-DPC中国联赛 正赛 Ehome vs Magma BO3 第一场 1月19日
2021/03/11 DOTA
python实现猜数字游戏(无重复数字)示例分享
2014/03/29 Python
使用Python进行新浪微博的mid和url互相转换实例(10进制和62进制互算)
2014/04/25 Python
pycharm 使用心得(二)设置字体大小
2014/06/05 Python
详解Django通用视图中的函数包装
2015/07/21 Python
使用Python脚本实现批量网站存活检测遇到问题及解决方法
2016/10/11 Python
python tkinter实现彩球碰撞屏保
2019/07/30 Python
Python实现井字棋小游戏
2020/03/09 Python
HTML5 语音搜索只需一句代码
2013/01/03 HTML / CSS
澳大利亚个性化儿童礼品网站:Bright Star Kids
2019/06/14 全球购物
Linux不知道文件后缀名怎么判断文件类型
2014/08/21 面试题
《沙漠中的绿洲》教学反思
2014/04/24 职场文书
学校运动会霸气口号
2014/06/07 职场文书
县政府领导班子“四风”方面突出问题整改措施
2014/09/23 职场文书
三方股份合作协议书
2014/10/13 职场文书
Android Gradle 插件自定义Plugin实现注意事项
2022/06/16 Java/Android