ajax文件上传

1 HTMl 部分

<!--选择水印图片-->
<div class="form-group" hidden = "hidden" id="imgdiv">
<label for="nameText" class="col-lg-4 control-label"><span class="txt-impt">*</span>选择图片</label>
<div class="col-lg-8">
<input id="file" type="file" name="file" style="display:none" accept="image/png, image/jpg" />
<input type="text" class="input-text" name="wmContent" id="imgContent"/>
</div>
<div class="col-lg-offset-4 tips">
<span class="txt-tips">选择png或jpg格式图片</span>
</div>
</div>

2 js部分

function uploadWaterMarkPic(callback){
$.ajaxFileUpload({
url : '/watermark/uploadWaterMarkPic.do',
secureuri : false,
dataType : 'json',// 返回数据的类型
fileElementId : 'file',// file标签的id
success : function(data, status) {
callback();
},
error : function(data, status, e) {
bootbox.alert("上传图片失败 !");
}
});
}

3后台

@RequestMapping("/uploadWaterMarkPic.do")
@ResponseBody
public void uploadWaterMarkPic(HttpServletRequest request)throws IllegalStateException, IOException {
String path = request.getSession().getServletContext().getRealPath("/WEB-INF/fileUpload");
CommonsMultipartResolver multipartResolver = new CommonsMultipartResolver(
request.getSession().getServletContext());
if (multipartResolver.isMultipart(request)) {
MultipartHttpServletRequest multiRequest = (MultipartHttpServletRequest) request;
Iterator<String> iter = multiRequest.getFileNames();
while (iter.hasNext()) {
MultipartFile file = multiRequest.getFile((String) iter.next());
if (file != null) {
String fileName = file.getOriginalFilename();
String filepath = path + fileName;
File localFile = new File(filepath);
// 写文件到本地
file.transferTo(localFile);
}
}
}
}