FormData异步上传
1.代码片段一:
ajaxUpload: function () {
var url = this.$avatarForm.attr('action'),
data = new FormData(this.$avatarForm[0]),
_this = this;
$.ajax(url, {
type: 'post',
data: data,
dataType: 'json',
processData: false,
contentType: false,
beforeSend: function () {
_this.submitStart();
},
success: function (data) {
_this.submitDone(data);
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
_this.submitFail(textStatus || errorThrown);
},
complete: function () {
_this.submitEnd();
}
});
},
2.代码片段二:
$(document).ready(function (e) {
$("#uploadForm").on('submit',(function(e) {
e.preventDefault();
$.ajax({
url: "upload.php",
type: "POST",
data: new FormData(this),
contentType: false,
cache: false,
processData:false,
success: function(data)
{
$("#targetLayer").html(data);
},
error: function()
{
}
});
}));
});
FormData异步上传的更多相关文章
- HTML5 jQuery+FormData 异步上传文件,带进度条
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <link href ...
- Ajax使用formdata异步上传文件,报错the request was rejected because no multipart boundary was found
基于jQuery的Ajaxs使用FormData上传文件要注意两个参数的设定 processData设为false 把processData设为false,让jquery不要对formData做处理, ...
- (H5)FormData+AJAX+SpringMVC跨域异步上传文件
最近都没时间整理资料了,一入职就要弄懂业务,整天被业务弄得血崩. 总结下今天弄了一个早上的跨域异步上传文件.主要用到技术有HTML5的FormData,AJAX,Spring MVC. 首先看下上传页 ...
- jquery运用FormData结合Ajax异步上传表单,超实用
首先创建一个formData,其中参数,就是你的form表单,jquery要加0,也可以用document.querySelector("form")得到 var formData ...
- 使用FormData实现ajax文件异步上传
1.传统的web开发文件上传一般是基于form表单的文件上传,同步的方式,用户体验差,可控性也差 2.异步上传的实现 有以下方式 2.1 借助浏览器插件 一般需要安装一些类似flash的插件 这种方 ...
- HTML5 FormData 模拟表单控件 支持异步上传二进制文件 移动端
FormData是XMLHttpRequest Level 2添加的一个新的接口,利用FormData对象,我们可以通过JavaScript用一些键值对来模拟一系列表单控件,还可以使用XMLHttpR ...
- FormData兼容IE10 360及DWR的异步上传原理
摘自:https://github.com/henryluki/FormData/blob/master/formdata.js if(!window.FormData) { (function(se ...
- Jquery FormData文件异步上传 快速指南
网站中文件的异步上传是个比较麻烦的问题,不过现在通过jquery 可以很容易的解决这个问题: 使用jquery2.1版本,较老版本不支持异步文件上传功能: 表单代码: <form id=&quo ...
- ajax+XMLHttpRequest里的FormData实现图片异步上传
发这篇博客的时候我是自己在研究这个XMLHttpRequest请求,在别人的博客上面知道XMLHttpRequest新加了一个FormData的东西,好像现在APP请求后台也有用这种方式的吧. 别的不 ...
随机推荐
- 重置 radio 和 checkbox 的样式
代码: <!doctype html> <html> <head> <meta charset="utf-8"> <title ...
- Redis源代码剖析和凝视(八)--- 对象系统(redisObject)
Redis 对象系统 1. 介绍 redis中基于双端链表.简单动态字符串(sds).字典.跳跃表.整数集合.压缩列表.高速列表等等数据结构实现了一个对象系统,而且实现了5种不同的对象,每种对象都使用 ...
- Warning: cast to/from pointer from/to integer of different size
将int变量转为(void*)时出现错误 error: cast to pointer from integer of different size [-Werror=int-to-pointer-c ...
- 复制Map对象:Map.putAll方法
复制Map对象:Map.putAll方法 Map.putAll方法可以追加另一个Map对象到当前Map集合 package xmu.sxl; import java.util.HashMap; imp ...
- 那些最好的轮子 - PHP篇
转载于:http://avnpc.com/pages/best-wheels-for-php 在关于不要重复造轮子的二三事一文中,交代了一些背景和想法.本篇则完全是一些干货,列举一些我用过或者即将会用 ...
- Linux命令-目录处理命令:cd
cd /tmp/shijiazhuang 切换到tmp目录下面的shijiazhuang目录 cd .. 切换到上一级目录
- appframework学习--nav的使用说明
app-framework学习--nav的使用说明: 语法: <nav id="mynav" style="background-image:url(../imag ...
- 关于flex,好像有12个属性非常重要
关于Flex,有12个属性非常重要 这几天在学习Flex布局,发现Flex真的好厉害! Flex是Flexible Box的缩写,意为"弹性布局",用来为盒模型提供最大的灵活性. ...
- Atitit.各种 数据类型 ( 树形结构,表形数据 ) 的结构与存储数据库 attilax 总结
Atitit.各种 数据类型 ( 树形结构,表形数据 ) 的结构与存储数据库 attilax 总结 1. 数据结构( 树形结构,表形数据,对象结构 ) 1 2. 编程语言中对应的数据结构 jav ...
- CXF学习笔记 之 “注解”
@WebService 1.serviceName: 对外发布的服务名,指定 Web Service 的服务名称:wsdl:service.缺省值为 Java 类的简单名称 + Service.(字符 ...