HTML代码:
<span tabindex="0" class="ant-upload" role="button"> <input type="file" accept="" style="display: none;" id="clueImgInput" onchange="uploadClueImg()"> <a href="javascript:void(0)" id="clueImgUploadButton" class="btn-normal"> <span>上传图片</span> </a> </span>
js触发点击选择文件代码:
$("#clueImgUploadButton").click(function () { $("#clueImgInput").click(); });
上传的请求:
function uploadClueImg() { var file_obj = document.getElementById('clueImgInput').files[0]; var fd = new FormData(); fd.append('file', file_obj); $.ajax({ type: 'post', url: "uploadClueImg", data: fd, cache: false, processData: false, contentType: false, }).success(function (data) { if (data.code === 107){ //上传成功 var url = data.data; $(".add-picture-win img").attr('src',''); $(".add-picture-win img").attr('src',url); } }).error(function () { }); }
后台
/** * 上传文件 * @param file */ public static void uploadFile(String resourceName, MultipartFile file, String dataUrl){ String filePath = dataUrl+resourceName+".xls"; // 保存文件 File tempSaveFile = new File(filePath); // if (tempSaveFile.exists()){ // tempSaveFile.delete(); // } if (!file.isEmpty()) { BufferedOutputStream out; try { out = new BufferedOutputStream(new FileOutputStream(tempSaveFile)); out.write(file.getBytes()); out.flush(); out.close(); } catch (FileNotFoundException e) { e.printStackTrace(); } catch (IOException e) { e.printStackTrace(); } } }