場景,需要上傳附近但不刷新當前頁面信息。
前段jsp代碼
1 <!DOCTYPE html> 2 <html><head> 3 <title></title> 4 <meta charset="utf-8"> 5 <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0"> 6 </head> 7 <script src="js/jquery-1.7.1.min.js"></script> 8 9 <body> 10 <button id="Photograph">拍照</button> 11 <form id="cardForm" enctype="multipart/form-data" method="post"> 12 <input type="file" name="file1" id="file1" accept="image/*" capture="camera" style="display: none;"> 13 </form> 14 <textarea id="text" STYLE="width: 400px;height: 200px"></textarea> 15 <script type="text/javascript"> 16 $(function () { 17 $("#Photograph").click(function () { 18 $("#file1").trigger("click"); 19 20 }); 21 22 $("#file1").change(function () { 23 var url=new FormData($("#cardForm")[0]); 24 /** 25 * 使用ajax提交form表單的上傳文件, 26 * 首先要使用FormData的獲取表單的上次文件數據, 27 * 在ajax中設置contentType:false,processData:false,cache:false,這三個屬性必須為false具體原因就不清楚了 28 * 但可以簡單說下這3個屬性的作用: 29 * cache 布爾值,表示瀏覽器是否緩存被請求頁面。默認是 true,因為是文件類型數據不需要緩存 30 * contentType 發送數據到服務器時所使用的內容類型。默認是:"application/x-www-form-urlencoded"。false就是不指定類型 31 * processData 布爾值,規定通過請求發送的數據是否轉換為查詢字符串。默認是 true。關鍵應該在這里,因為我們上傳的是文件類型數據,如果 32 * 不設置processData:false請求就好將文件類型數據去轉換為字符串會導致js報錯。 33 */ 34 $.ajax({ 35 url:"Servlet", 36 type:"post", 37 contentType:false, 38 processData:false, 39 cache:false, 40 data:url, 41 success:function (data) { 42 $("#text").text(data); 43 console.log(data); 44 } 45 }); 46 }); 47 }); 48 49 </script> 50 </body></html>
后端Servlet代碼:當然如果是SpringMVC等框架的話,前段不需要改動將后端按照SpringMvc的方式修改就可以了。
http://www.cnblogs.com/gynbk/p/6556270.html 上傳文件代碼地址
使用Commons-FileUpload組件實現文件上傳
1. 創建上傳對象
創建一個工廠對象
DiskFileItemFactory factory=new DiskFileItemFactory ();
創建一個新的文件上傳對象
ServletFileUpload upload=new ServletFileUpload(factory);
2. 解析上傳請求
通過parseRequest()方法獲取全部表單項。
Public List parseRequest(HttpServletRequest request) throws FileUploadException
通過isFormField()方法判斷表單項是文件域還是普通表單域。如果返回true說明是普通表單域。
Public Boolean isFormField()
通過FileItem類的getName()方法實現獲取文件上傳名稱。
getSize()方法獲得文件上傳的大小。
getContentType()方法獲得上傳文件的類型。
上傳文件實例
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { // TODO Auto-generated method stub String ctname; //獲得文件上傳的真實地址 String fileDir=request.getRealPath("upload/"); String mesg="文件上傳成功"; String address=""; //判斷是否上傳文件 if(ServletFileUpload.isMultipartContent(request)){ //創建一個工廠對象 DiskFileItemFactory factory=new DiskFileItemFactory(); //設置內存中允許存儲的字節 factory.setSizeThreshold(20*1024); //設置存放臨時文件的路徑 factory.setRepository(factory.getRepository()); //創建一個上傳文件的對象 ServletFileUpload upload=new ServletFileUpload(factory); //設置上傳文件大小 int size=4*1024*1024; //保存上傳文件的集合對象 List list=null; try { //獲得上傳文件列表 list=upload.parseRequest(request); } catch (FileUploadException e) { // TODO Auto-generated catch block e.printStackTrace(); } //創建迭代器 Iterator iter=list.iterator(); //循環迭代 while(iter.hasNext()){ //創建FileItem對象,獲得每一個上傳文件 FileItem flie=(FileItem)iter.next(); //判斷是文件域或普通表單域 if(!flie.isFormField()){ //獲得文件名稱 String name=flie.getName(); //判斷文件大小是否超過設定文件大小 if(flie.getSize()>size){ mesg="文件過大,無法上傳"; } //獲取上傳文件大小 String ctsize=new Long(flie.getSize()).toString(); //判斷文件是否存在 if((name==null || name.equals("")) && ctsize.equals("0")){ mesg="文件為空。"; continue;//文件為空跳出本次循環 } //創建上傳文件的名稱 ctname=name.substring(name.lastIndexOf("\\")+1,name.length()); address=fileDir+"\\"+ctname; //創建File對象,根據文件地址創建一個空文件 File file=new File(address); try { //向創建的文件中寫入數據 flie.write(file); } catch (Exception e) { // TODO Auto-generated catch block e.printStackTrace(); } } } } //返回文本內容的方式 response.setCharacterEncoding("utf-8"); response.getWriter().write(mesg); //RequestDispatcher 跳轉頁面方式 //request.setAttribute("msg", mesg); dispatcher=request.getRequestDispatcher("Deal.jsp"); //執行轉發 //dispatcher.forward(request, response); doGet(request, response); }