Ajax 异步上传文件 formData
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]); 获取整个表单的数据
发表评论