??????本篇博客主要采用了springboot+easyui框架，實現用戶在前臺進行上傳文件。
整個過程分為以下兩步：

1 前臺定義文件框進行文件的選取。
2 用戶通過對選取文件進行上傳。

前臺頁面

1 定義文件上傳按鈕

<a href="#button" class="button icon arrowup" onclick="uploadidalogonline();">上傳學習證明材料</a>

2 定義文件框

<div id="uploadonlineinfo" class="easyui-window" style="width:380px;padding:10px 40px" closed="true"><form id="fam" method="post" enctype="multipart/form-data"><table border="0" style="margin-top:4px;" width="100%" align="center"><tr><td><input class="easyui-filebox" name="onlinefilename" data-options="prompt:'文件上傳'" style="width:100%"></input></td></tr></table></form><div data-options="region:'south',border:false" style="text-align:center;padding:5px 0 0;"><a class="easyui-linkbutton" data-options="iconCls:'icon-ok'" href="javascript:void(0)" onclick="uploadonline();" style="width:80px">上傳</a></div> </div>

3 js函數

<script type="text/javascript"> //在線培訓上傳文件框顯示function uploadidalogonline() {$('#uploadonlineinfo').window('open').dialog('setTitle','文件上傳');}function uploadonline() {var add="/onlineupload";$('#fam').form('submit',{url: add,onSubmit: function(){},success: function(result){var result = eval('('+result+')');if (result.success){$('#uploadonlineinfo').window('close');$('#dg2').datagrid('reload');$.messager.show({title: 'Success',msg: '上傳成功'});} else {$.messager.show({title: 'Error',msg: '文件不能為空，請重新選擇文件！'});}}});}</script>

controller處理

1 文件上傳函數

public class uploadFile {public static void uploadFile(byte[] file, String filePath, String fileName) throws Exception {File targetFile = new File(filePath);if(!targetFile.exists()){targetFile.mkdirs();}FileOutputStream out = new FileOutputStream(filePath+fileName);out.write(file);out.flush();out.close();}}

2 文件上傳

@RequestMapping(value="/onlineupload", method = RequestMethod.POST)@ResponseBodypublic Map<String,String> onlineupload(@RequestParam("onlinefilename") MultipartFile file,HttpServletRequest request) { // String contentType = file.getContentType();Map<String,String> map=new HashMap<>();String fileName = file.getOriginalFilename();System.out.println("fileName"+fileName);String filePath="E:\\fileupload\\";System.out.println("filePath "+filePath);try {uploadFile.uploadFile(file.getBytes(), filePath, fileName);} catch (Exception e) {// TODO: handle exception}//返回jsonSystem.out.println("file + success!");if(file==null){map.put("error","false");}map.put("success","true");return map;}

因為沒有加@ResponseBody這個注解，以至于用戶前臺上傳文件的時候，ajax中的success函數報錯。加上該注解，文件上傳成功后，右下角會有提示框進行提示。

功能演示

按鈕頁面

文件選取

上傳提示

文件夾結果

控制臺結果

總結

以上是生活随笔為你收集整理的Springboot+easyUI filebox实现单个文件上传的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。