levysnail 2013-12-04
ajaxFileUpload下载地址http://www.phpletter.com/Our-Projects/AjaxFileUpload/
jsp
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <!DOCTYPE html> <head> <title>MyWebProject</title> <meta charset="utf-8" /> <link type="text/css" href="${pageContext.request.contextPath}/jsnew/ajaxfileupload.css" rel="stylesheet" /> <script type="text/javascript" src="${pageContext.request.contextPath}/jsnew/jquery.js"></script> <script type="text/javascript" src="${pageContext.request.contextPath}/jsnew/ajaxfileupload.js"></script> <script type="text/javascript"> function ajaxFileUpload() { $.ajaxFileUpload({ url : "${pageContext.request.contextPath}/space/quicklogin/fileUpload.html", //submit to UploadFileServlet secureuri : false, fileElementId : "file", //input file 的id dataType : "text", //or json xml whatever you like~ success : function(data, status) { $("#result").append(data); }, error : function(data, status, e) { $("#result").append(data); } }); return false; } </script> </head> <body> <input id="file" type="file" size="45" name="file" class="input"/><br/> <button class="button" id="buttonUpload" onclick="return ajaxFileUpload();">Upload</button> <div id="result"></div> </body> </html> </html>
action
public class uploadAction extends BaseAction { private File file; private String fileFileName; private String fileFileContentType; private String message = "你已成功上传文件"; public void wxfileUpload() { HttpServletRequest request = this.getRequest(); HttpServletResponse response = null; PrintWriter out = null; String encoding = "UTF-8"; try { response = this.getResponse(); response.setContentType("text/html;charset=utf-8"); response.setCharacterEncoding(encoding); out = response.getWriter(); request.setCharacterEncoding(encoding); String path =ServletActionContext.getServletContext().getRealPath(file.separator+"upload"); File f = this.getFile(); if(this.getFileFileName().endsWith(".exe")){ message = "对不起,你上传的文件格式不允许!!!"; } FileInputStream inputStream = new FileInputStream(f); File upfile=new File(path +File.separator+ this.getFileFileName()); if(upfile.isDirectory() && !upfile.exists()) upfile.mkdirs(); else if(!upfile.isDirectory() && !upfile.getParentFile().exists()) upfile.getParentFile().mkdirs(); FileOutputStream outputStream = new FileOutputStream(upfile); byte[] buf = new byte[1024]; int length = 0; while ((length = inputStream.read(buf)) != -1) { outputStream.write(buf, 0, length); } inputStream.close(); outputStream.flush(); outputStream.close(); out.print("Success Upload"); } catch (Exception e) { e.printStackTrace(); out.print("Success ERROR"); logger.info("WxAction reply exception:" + e); } finally { if (out != null) out.close(); } } } //.....get set()...
action配置文件
<action name="fileUpload" class="com.bjdata.bjsearch.presentation.action.weix.uploadAction" method="fileUpload"> </action>
为了美观,把 type="file" 控件隐藏。点击“上传”按钮,click调用隐藏文件控件,再选择文件。查了一遍,好像是ie为了安全控制,文件的必须鼠标点击过后,才能提交。还没有想到其他的方法。。。
5,success 提交成功后自动执行的处理函数,参数data就是服务器返回的数据。6,error 提交失败自动执行的处理函数。7,data 自定义参数。fileElementId: 'file1',
-- 引入相关的js文件,相对路径 -->. -- 执行上传文件操作的函数 -->. method=uploader', //需要链接到服务器地址。fileElementId:'houseMaps',