js教程：图片异步上传

营业执照
办学资质
售后服务

+收藏

求学价：面议发布用户：niuniuniu

发布时间：2017-10-20 已有27人浏览报名

开课日期：
随到随学/常年招生
上课时间：
电话咨询
授课学校：
成都牛牛牛实训教育
授课地点：
成都市锦江区牛王庙东大街东方广场B座17楼1703详细地图
咨询电话：
15196685573

课程介绍

大家好，针对较近有童鞋问到在网站中图片异步上传的前端实现，有些仍然使用iframe实现，牛牛牛告诉你在HTML5的时代中，你真的OUT啦！

为什么需要异步上传图片，你是否get到啦？

增加用户体验
进行上传结果预览
减少由于上传出错导致的服务器与浏览器之间的数据传输量

…

废话不多话，直接先看结果：

上传页面：

异步上传预览：

主要原理：

获得用户选择的图片
将图片通过ajax异步上传到服务器
服务器将成功上传之后保存的路径返回
通过js将服务器返回结果显示到页面中

主要知识点：

File对象得到浏览器中选择的文件
FormData对象封装数据
通过ajax将FormData对象发送到服务器

执行流程图：

Tips:注意此处我们为了说明问题，采用了原生JS发送AJAX请求，如果是使用Jquery发送AJAX只需要指明:data属性为FormData对象即可。

是不是很简单呢？赶快试一下吧！！！

显示全部

学校介绍

成都牛牛牛实训教育

认证机构

黄金会员5年

查看信用档案

学校人气度：177

站内注册：
2017-07-25
课程总数：
共15个
主营业务：
IT技能培训
咨询老师：
李老师

成都牛牛牛信息技术有限公司自成立以来，注重实用型人才培养，把公司商业项目运用到实际人才培养中。“掌握前沿技术，纵横IT世界，牛牛牛与您共创未来”，以的专业人才素质和领先的科技水平为依托，将优质的服务送到了全国的各省区，涉及到IT、银行、金融、保险、航空、税务、电力、石油和教育等数十个行业领域，并创建了一个个一流的项目、为客户解决了无数的问题。除了软件外包业务承接各种商务项目之外，我们也注重人才培养，提供人才外包，提供人才培训服务。培训范围：UI界面设计师培训、WEB前端开发工程师培训、JAVA软件开发工程师培训、PHP开发工程师培训等其他专业。多次提升，专业团队，前沿技术，技术支持，项目实训，就业保障，高薪就业.....

进入学校主页