<form id="submitForm" method="post" enctype="multipart/form-data">
<input id="submitFile0" type="file" name="file"/><input id="button0" type="button" value="上传"
onclick="userPicInfo.submitForm(0);"/><br>
<input id="submitFile1" type="file" name="file"/><input id="button1" type="button" value="上传"
onclick="userPicInfo.submitForm(1);"/><br>
<input id="submitFile2" type="file" name="file"/><input id="button2" type="button" value="上传"
onclick="userPicInfo.submitForm(2);"/>
</form>
对应js:
submitForm: function (i) {
var formData = new FormData();
formData.append('file', $('#submitFile'+i)[0].files[0]);
$.ajax({
url: getRootPath() + "/userPicInfo/uploadPhoto",
type: 'post',
data: formData,
async: false,
cache: false,
contentType: false,
processData: false,
success: function (data) {
if (data.picurl) {
userPicInfo.infoContents.push(data.picurl)
$('#info_content_add').val(userPicInfo.infoContents.join(","));
// var img = document.createElement("img");
// img.src = data.picurl;
// document.getElementsByTagName("form")[1].insertBefore(img, document.getElementById("button1"));
}
easyShow(data.msg, 'info');
},
error: function (data) {
easyShow(data.msg, 'info');
}
});
},
controller
@RequestMapping("/uploadPhoto")
@ResponseBody
public Map<String, Object> uploadFile(@RequestParam("file") MultipartFile file) {
Map<String, Object> map = new HashMap<String, Object>();
try {
InputStream inputStream = file.getInputStream();
byte[] bytes = IOUtils.toByteArray(inputStream);
//TODO 省去将文件上传方法
IOUtils.closeQuietly(inputStream);
//TODO 省去接收上传成功后信息
if (res.getErrCode() == 0 && res.getOriginalLink() != null) {
map.put(RcsParam.SUCCESS, true);
map.put(RcsParam.MSG, "上传图片成功!");
map.put("picurl", res.getOriginalLink());
} else {
map.put(RcsParam.SUCCESS, false);
map.put(RcsParam.MSG, "上传图片失败!");
}
} catch (Exception e) {
map.put(RcsParam.SUCCESS, false);
map.put(RcsParam.MSG, "系统异常");
}
return map;
}