ajax 异步form上传文件和 上传图片base64预览

<input type="file" name="shop_pics[]" data-val="1" accept="image/jpeg,image/peg,image/jeg" onchange="uploadImg(this)"/>
<img src="" width="200px" height="200px" class="image_1">

function uploadImg(ob) {

var file = ob.files[0];

var token ='';

var base64Data =null;

if (window.FileReader) {

var fr =new FileReader();

fr.readAsDataURL(file);

fr.onloadend =function (e) {

base64Data = e.target.result;

var url ='/';

var fd = {picture:base64Data, };

$.ajax({

type:"POST",

url:url,

data:fd,

async:false,

success:function (res) {

if (res.success ==true) {

return;

}

layer.msg(res.retMsg, {icon:2,time:1000});

},

error:function (msg) {

layer.msg('error', {icon:2,time:1000});

}

});

}

}

}

上传文件

<a href="javascript:;" class="a-upload btn-primary">
<input type="file" name="shop_file[]" class="filepath" data-val="1" accept=".rar,.zip,.doc,.docx,.pdf,.jpg,.xls,.xlsx" onchange="uploadFile(this)">File upload</a>

function uploadFile(ob) {

var formData =new FormData();

var file = ob.files[0];

var url ='';

formData.append('file',file);

formData.append('_token',token);

$.ajax({

type:'POST',

url:url,

data:formData,

dataType:"json",

cache:false,

contentType:false,

processData:false,

async:false,

mimeType:"multipart/form-data",

success:function (res) {

if (res.success ==true) {

return;

}

layer.msg(res.msg, {icon:2,time:1000});

}

});

}