[TOC] 前台页面： ### 1. 点击“上传”触发selectFile（） ~~~ <form id="signupListImportForm" enctype="multipart/form-data"> <input type="file" name="appFile" id="excelFile" style="display:none" multiple="multiple" onchange="fileUpload(${item.id})"> <button type="button" class="btn btn-primary btn-sm" type="button" value="上传" onclick="selectFile()"> 上传</button> </form> ~~~ ### 2. selectFile() 触发上传文件 ### 3. 上传文件后onchange="fileUpload(${item.id})"触发向后台发送ajax请求 ajaxSubmit()马上由AJAX来提交表单 ~~~ function fileUpload(id){ var option = { url : "${ctx}/app_version/upload", data: {"id": id}, type:"POST", success : function(map) { if(map.rtnFlag == 'apk'){ bootbox.alert({ size: 'small', title: '提示', message: "请上传apk文件！" }); }else if(map.rtnFlag){ bootbox.alert({ size: 'small', title: '提示', message: "上传成功！" }); location.reload(); }else { bootbox.alert({ size: 'small', title: '提示', message: "上传失败！" }); }; }, error:function(data){ bootbox.alert({ size: 'small', title: '提示', message: "上传失败！" }); } }; $("#signupListImportForm").ajaxSubmit(option); return false; } ~~~ ### 3. controller ~~~ /** * 上传APP * @param id 唯一标识 * @param file APP文件 * @return */ @RequestMapping(value = "upload", method = RequestMethod.POST) @ResponseBody public HashMap<String,Object> upLoadApp(@RequestParam("id") Integer id, @RequestParam("appFile") MultipartFile file) { HashMap<String, Object> ret = new HashMap<>(); ret.put("rtnFlag", true); String fileName = file.getOriginalFilename(); String fileExt = fileName.substring(fileName.lastIndexOf(".")+1); String version = fileName.substring(0,fileName.lastIndexOf(".")); if(fileExt.equals("apk")){ if (!file.isEmpty()) { try { byte[] app = file.getBytes(); String apkPath = trackerHttp + "/" + FastDFSClientUtil.uploadFile(app, "apk"); System.out.println("文件路径：" + apkPath+ "id:" + id); AppVersionOrg appVersionOrg = new AppVersionOrg(); appVersionOrg.setVersionAndroidUrl(apkPath); appVersionOrg.setId(id); appVersionOrg.setVersion(version); this.appVersionService.modify(appVersionOrg); } catch (Exception e) { e.printStackTrace(); ret.put("rtnFlag", "false"); ret.put("message", e.getMessage()); } } }else { ret.put("rtnFlag", "apk"); } return ret; } ~~~  ### 4. springmvc 支持文件上传 ~~~ <!-- 支持上传文件 --> <bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver"> <!--页面文件上传最大长度50000000kb--> <property name="maxUploadSize" value="50000000" /> </bean> ~~~ ## 5. ajax提交form表单 ~~~ //<form id="personal_info"> 使用form,导致ajax提交失败 <div id="personal_info"> <div class="row"> <div class="col-sm-2"> <img id="headImg" name="headImg" src="${moocUser.headImg}" alt="headImg" class="img-circle img-responsive" style="width: 100px;height: 100px"> </div> <input class="col-sm-2" type="file" class="file" id="image-input" onchange="changImg(event)"> </div> <div class="form-group"> <label for="nickName">昵称</label> <input type="text" class="form-control" id="nickName" value="${moocUser.nickName}" tag="${moocUser.id}" readonly="readonly"> </div> <div class="form-group"> <label for="mobile">电话</label> <input type="text" class="form-control" id="mobile" value="${moocUser.mobile}" readonly="readonly"> </div> <div class="form-group"> <label for="email">邮箱</label> <input type="email" class="form-control" id="email" value="${moocUser.email}" readonly="readonly"> </div> //问题就应该出现在type="submit" <button type="submit" class="btn btn-default" onclick="editInfo()">保存</button> </div> //</form> ~~~ 错误一、网页是form表单提交的话，会和ajax的提交方式冲突，导致回调失败（即不执行成功或者失败回调函数）！