Ajax 异步上传文件 formData

Ajax 异步上传文件 formData

0 696 0

admin

2019-05-20

HTML

< form method="post" id="form_id" enctype="multipart/form-data">

< input type="file" id="ar_img" name="ar_img" accept="image/*" >
< textarea id="ar_content" name="ar_content" style="width:100%;height:300px;">

< / form>

JS

//var formData = new FormData($('form')[0]); //获取整个表单数据

var form=document.getElementById("form1");//form id 获取整个表单数据
var formData = new FormData(form); //实例formData对象获取整个表单数据
formData.append("ar_content", $('#ar_content').val()); //内容
formData.append("ar_img", document.getElementById("ar_img").files[0]); //上传图片
$.ajax({
url: "article/add",
type: "POST",
data: formData,
/**
*必须false才会自动加上正确的Content-Type
*/
contentType: false,
/**
* 必须false才会避开jQuery对 formdata 的默认处理
* XMLHttpRequest会对 formdata 进行正确的处理
*/
processData: false,
success: function (data) {
var obj = JSON.parse(data);
if (obj.status == 200) {
layer.alert(obj.msg,{icon:6});
// 获得frame索引
var index = parent.layer.getFrameIndex(window.name);
//关闭当前frame
parent.layer.close(index);
}
if (obj.status != 200) {
layer.alert(obj.msg,{icon:5});
}
},
error: function () {
alert("上传失败！");
$("#imgWait").hide();
}
});
return false;

注：

new FormData($('form')[0]);  获取整个表单的数据

THE END

喜欢就支持以下吧

相关推荐

评论抢沙发

友好交流，请勿发纯表情，请勿灌水，会被封号喔

提交

*^_^*

取消

表情快捷回复