前端之家收集整理的这篇文章主要介绍了
ajax异步上传文件，
前端之家小编觉得挺不错的，现在分享给大家，也给大家做个参考。
$(".upload-img").on("click",function(){
$("#file-uploader").click().on("change",function(){
$(".resp-result-span").html("");//清空上次右侧处理结果
$(".resp-json-container").val("");
$(".resp-result-span").html("<h3>图片处理中...</h3>");
var file = this.files[0];
//console.log(file);
if(!/image\/[(jpg)(png)]+/.test(file.type)){
alert("请确保文件为图像类型");
return false;
}
var reader = new FileReader();
reader.readAsDataURL(file);
reader.onload = function(e){
$("#face-img").attr("src",this.result);
}
var formData = new FormData();
formData.append("file",$("#file-uploader")[0].files[0]);
$.ajax({
type:'POST',url:'<%=basePath%>/pic/file',data : formData,// 告诉jQuery不要去处理发送的数据
processData : false,// 告诉jQuery不要去设置Content-Type请求头
contentType : false,dataType:'json',success:function(data){
$(".resp-result-span").html("");//清空数据
$(".resp-json-container").val("");
$(".resp-result-span").html("<img src='data:image/png;base64,"+data.img+"'>");//写入内容
$(".resp-json-container").val(JSON.stringify(data,null,"\t"));//写入内容
}
});
});
});
