瑾忆 admin
一直往前走,别往后看。要知道每一次回头,都会错过一些眼前的风景。 ​​​​
啥也不是 啥也不会 懒癌晚期 广西靓仔
文章
127
微语
181
评论
1036
个人档
Do you like me?
551

使用FormData方法实现Ajax上传文件

瑾忆 · 3年前
2019-4-26 · 默认 · 1.4k · 3

FormData对象是html5的一个对象,目前的一些主流的浏览器都已经兼容。

如果是IE,那打扰了。

之前我也试过ajax提交表单且带有文件(图片),结果后台接收不到input file的数据。

后来用了另外一种麻烦的方法,就是将图片转换成Base64再提交,显然这方法好麻烦转来转去的,得不偿失。

所以在度娘的帮助下邂逅了FormData,233

道理什么的就自行百度吧,反正我也不懂,我的能用就行,懒得去理解些什么。哈哈哈

HTML

<form id="Form">
	<input name="file" type="file">
	<input type="text" name="text" value="abcdefg">
	<input type="button" value="提交" class="btn"/>
</form>

JS

	$('.btn').click(function (){
		//创建这个所谓的FormData对象,哈哈
		var form = new FormData(document.getElementById("Form"));
		$.ajax({
			url:"你的接口连接",
			type:"POST",
			data:form,
			processData:false,
            contentType:false,
			mimeType:"multipart/form-data",
			success:function(data){
				//成功
			},
			error:function(e){
				//错误
			}
		});  
		return false;
	});

不才,不会说明怎么使用,大概就是这个样子,我是实践成功了,遇到问题就去找下万能的度娘。

April 26,2019 14:11:42
阅读1.4k
撰写评论
Comments
知识共享网
不得不说,你这个模板很好看
#2 3年前 (2019-05-03)
回复
瑾忆
@知识共享网:Thanks♪(・ω・)ノ
#2-1 3年前 (2019-05-05)
回复
uv喷绘
写的不错
#1 3年前 (2019-05-03)
回复