一、简介
ajaxFileUpload是一种异步的文件上传控件,通过ajax进行文件上传,并获取上传处理结果。在很多时候我们需要使用到文件上传的功能,但是不需要使用那些强大的上传插件。此时就可以使用ajaxFileUpload。它基于jquery,本质是使用iframe完成上传。下载地址为:下载。
二、实例
网页代码如下:
1 <%@ page contentType="text/html; charset=UTF-8"%> 2 <!DOCTYPE html> 3 <html> 4 <head> 5 <title>文件上传</title> 6 </head> 7 <body> 8 <div> 9 <form id="formItem">10 <div id="contentTable" style="border:0px;">11 <h1 class="title" style="font-size:15px;border-bottom:1pxsolid#DFE3E6;">excel文件上传</h1>12 <table width="80%">13 <tr>14 <td width="30%" align="right">15 选择要上传的excel文件16 </td>17 <td width="70%" style="text-align:center;">18 <input type="file" id="file1" name="file"/>19 </td>20 </tr>21 </table>22 <div>23 <input type="button" value="导入 "/>24 </div>25 </div>26 </form>27 </div>28 <scriptsrc="${pageContext.request.contextPath}/res/js/jquery-1.9.1.min.js"type="text/javascript"></script>29 <scriptsrc="${pageContext.request.contextPath}/res/js/ajaxfileupload.js"></script>30 <scripttype="text/javascript">31 var flag=false;32 $(function(){33 //文件类型过滤34 $(":button").click(function(){35 varfilepath = $("#file1").val();36 vararr = new Array();37 arr = filepath.split(".");38 var fileType = new Array(["xls"],["xlsx"]);39 for(var i = 0; i < fileType.length; i++){40 if(arr[1] == fileType[i]){41flag = true;42 }43 }44 if(flag){45 ajaxFileUpload();46 }else{47 alert("请选择excel文件上传")48 return false;49 }50 })51 });5253 functionajaxFileUpload(){54 $.ajaxFileUpload55 (56{57 url : '${pageContext.request.contextPath}/file/upload.action',//用于文件上传的服务器端请求地址58 secureuri : false,//一般设置为false59 fileElementId : 'file1',//文件上传空间的id属性60 dataType : 'json',//返回值类型一般设置为json61 success : function(data,status)//服务器成功响应处理函数62 {63 if(data){64alert("上传成功!");65$("#file1").val("");66 }67 flag = false;68 },69 error : function(data,status,e)//服务器响应失败处理函数70 {71 alert(e);72 }73}74 )75 return false;76 }77 </script>78 </body>79 </html>
服务器端代码如下:
/***使用springmvc进行文件上传处理*/@RequestMapping("upload")@ResponseBodypublic boolean upload(HttpServletRequest request, HttpServletResponse response ) throws UnsupportedEncodingException{String path = request.getSession().getServletContext().getRealPath("");Calendar calendar = Calendar.getInstance();calendar.setTime(new Date());request.setCharacterEncoding("UTF-8");path = String.format("%s\\%s\\%s\\%s\\%s\\%s", path, "file", "upload", calendar.get(calendar.YEAR),calendar.get(calendar.MONTH), calendar.get(calendar.DAY_OF_MONTH));File filepath = new File(path);if (!filepath.exists()) {filepath.mkdirs();}MultipartHttpServletRequest multipartRequest = (MultipartHttpServletRequest) request;// 获得文件MultipartFile multipartFile = multipartRequest.getFile("file"); String filename = multipartFile.getOriginalFilename();OutputStream os = null;InputStream is = null;File uploadFile = null;try {is = multipartFile.getInputStream();if (is != null) {uploadFile = new File(filepath, System.currentTimeMillis() + ".xls");os = new FileOutputStream(uploadFile);IOUtils.copy(is, os);os.flush();}} catch (IOException e) {e.printStackTrace(); return false;} finally {IOUtils.closeQuietly(os);IOUtils.closeQuietly(is);} return true;}