3.1版本相对于之前的版本在方法名上做了相应的修改,比如:
 

2.X

3.1

'uploader''uploadify.swf',    

         

'swf''uploadify-v3.1/uploadify.swf'

  

'script':'servlet/upload',

'uploader':'servlet/upload'

'cancelImg''jquery/cancel.png'

cancelImage直接修改uploadify.css中的.uploadify-queue-item .cancel

'fileExt''*.jpg;*.gif',

'fileTypeExts':*.jpg;*.gif',   

'fileDesc''支持格式:jpg/gif.',

'fileTypeDesc''支持格式:jpg/gif'

上传成功触发:onComplete

上传成功触发:onUploadSuccess

开始上传的触发事件

<a href="javascript:jQuery('#uploadify').uploadifyUpload()">开始上传</a>

开始上传的触发事件

<a href="javascript:jQuery('#uploadify').uploadify('upload','*')">开始上传</a>

等等。
    需要以下几个jar包
    ·commons-fileupload-1.2.jar
    ·commons-io-1.4.jar
    ·commons-logging.jar
uploadify可在官方下载最新版 http://www.uploadify.com/

 
目录:

 
index.jsp代码

 
 
   
  1. <%@ page language="java" contentType="text/html; charset=gbk"%> 
  2.  
  3.  
  4. <%  
  5. String path = request.getContextPath();  
  6. String basePath = request.getScheme() + "://"  
  7. + request.getServerName() + ":" + request.getServerPort()  
  8. + path + "/";  
  9. %> 
  10. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 
  11. <html> 
  12. <head> 
  13. <title>Upload</title> 
  14.  
  15.  
  16. <!--装载文件--> 
  17. <link href="uploadify-v3.1/uploadify.css" type="text/css" 
  18. rel="stylesheet" /> 
  19. <script type="text/javascript" src="js/jquery-1.7.1.min.js"></script> 
  20. <script type="text/javascript" 
  21. src="uploadify-v3.1/jquery.uploadify-3.1.js"></script> 
  22. <script type="text/javascript" src="js/swfobject.js"></script> 
  23.  
  24.  
  25.  
  26.  
  27. <!--ready事件--> 
  28. <script type="text/javascript"> 
  29.   $(document).ready(function () {  
  30.  $("#uploadify").uploadify({  
  31.  'swf': 'uploadify-v3.1/uploadify.swf',   
  32.   'uploader':'servlet/upload',   
  33.  //'script':'upload!doUpload.action?name=yangxiang',  
  34.  //'script': 'servlet/Upload?name=yangxiang',    
  35.  //'cancel' : 'uploadify/uploadify-cancel.png',                    
  36.  'queueID' : 'fileQueue', //和存放队列的DIV的id一致    
  37.  //'fileDataName': 'fileupload', //必须,和以下input的name属性一致                     
  38.  'auto'  : false, //是否自动开始    
  39.  'multi': true, //是否支持多文件上传    
  40.   'buttonText': 'BROWSE', //按钮上的文字    
  41.  'simUploadLimit' : 1, //一次同步上传的文件数目    
  42.  //'sizeLimit': 19871202, //设置单个文件大小限制,单位为byte    
  43.  'fileSizeLimit' : '6000KB',  
  44.   'queueSizeLimit' : 10, //队列中同时存在的文件个数限制    
  45.  'fileTypeExts': '*.jpg;*.gif;*.jpeg;*.png;*.bmp',//允许的格式  
  46.   'fileTypeDesc': '支持格式:jpg/gif/jpeg/png/bmp.', //如果配置了以下的'fileExt'属性,那么这个属性是必须的    
  47.  'onUploadSuccess': function ( fileObj, response, data) {    
  48.   alert("文件:" + fileObj.name + "上传成功");  
  49.  },    
  50.  'onUploadError': function(event, queueID, fileObj) {    
  51.   alert("文件:" + fileObj.name + "上传失败");    
  52.  },    
  53.  'onCancel': function(event, queueID, fileObj){    
  54.   alert("取消了" + fileObj.name);    
  55.    }   
  56.  });  
  57.  
  58. });  
  59.      </script> 
  60. </head> 
  61.  
  62. <body> 
  63. <div id="fileQueue" style="width: 30%"></div> 
  64. <input type="file" name="uploadify" id="uploadify" /> 
  65. <p> 
  66.  
  67.  
  68. <a href="javascript:jQuery('#uploadify').uploadify('upload','*')">开始上传</a>&nbsp;  
  69.  
  70.  
  71. <a href="javascript:jQuery('#uploadify').uploadifyClearQueue()">取消所有上传</a> 
  72. </p> 
  73. </body> 
  74.  
  75. </html> 
后台代码
 
   
  1. /**  
  2.  * get及post提交方式  
  3.  *   
  4.  * @param request  
  5.  * @param response  
  6.  * @throws ServletException  
  7.  * @throws IOException  
  8.  */ 
  9. public void doGetAndPost(HttpServletRequest request,  
  10. HttpServletResponse response) throws ServletException, IOException {  
  11. request.setCharacterEncoding("GBK");  
  12. // 文件存放的目录  
  13. //C:\\Documents and Settings\\jnzbht\\Workspaces\\MyEclipse 8.5\\upload\\WebRoot\\upload\\  
  14. File tempDirPath = new File(request.getSession().getServletContext()  
  15. .getRealPath("/")  
  16. "\\upload\\");  
  17. if (!tempDirPath.exists()) {  
  18. tempDirPath.mkdirs();  
  19. }  
  20.  
  21.  
  22. // 创建磁盘文件工厂  
  23. DiskFileItemFactory fac = new DiskFileItemFactory();  
  24. // 创建servlet文件上传组件  
  25. ServletFileUpload upload = new ServletFileUpload(fac);  
  26. //使用utf-8的编码格式处理数据  
  27. upload.setHeaderEncoding("utf-8");   
  28. // 文件列表  
  29. List fileList = null;  
  30. // 解析request从而得到前台传过来的文件  
  31. try {  
  32. fileList = upload.parseRequest(request);  
  33. catch (FileUploadException ex) {  
  34. ex.printStackTrace();  
  35. return;  
  36. }  
  37. // 保存后的文件名  
  38. String p_w_picpathName = null;  
  39. // 便利从前台得到的文件列表  
  40. Iterator<FileItem> it = fileList.iterator();  
  41. while (it.hasNext()) {  
  42. FileItem item = it.next();  
  43. // 如果不是普通表单域,当做文件域来处理  
  44. if (!item.isFormField()) {  
  45. //生成四位随机数  
  46. Random r = new Random();  
  47. int rannum = (int) (r.nextDouble() * (9999 - 1000 + 1)) + 1000;   
  48. p_w_picpathName = DateUtil.getNowStrDate() +  rannum  
  49. + item.getName();  
  50.  
  51.  
  52. BufferedInputStream in = new BufferedInputStream(item  
  53. .getInputStream());  
  54. BufferedOutputStream out = new BufferedOutputStream(  
  55. new FileOutputStream(new File(tempDirPath + "\\" 
  56. + p_w_picpathName)));  
  57. Streams.copy(in, out, true);  
  58.  
  59.  
  60. }  
  61. }  
  62. //     
  63. PrintWriter out = null;  
  64. try {  
  65. out = encodehead(request, response);  
  66. catch (IOException e) {  
  67. e.printStackTrace();  
  68. }  
  69. // 这个地方不能少,否则前台得不到上传的结果  
  70. out.write("1");  
  71. out.close();  
  72. }  
  73.  
  74.  
  75. /**  
  76.  * Ajax辅助方法 获取 PrintWriter  
  77.  *   
  78.  * @return  
  79.  * @throws IOException  
  80.  * @throws IOException  
  81.  *             request.setCharacterEncoding("utf-8");  
  82.  *             response.setContentType("text/html; charset=utf-8");  
  83.  */ 
  84. private PrintWriter encodehead(HttpServletRequest request,  
  85. HttpServletResponse response) throws IOException {  
  86. request.setCharacterEncoding("utf-8");  
  87. response.setContentType("text/html; charset=utf-8");  
  88. return response.getWriter();  
  89. }  
在doPost中调用即可

 
Web.xml中
 
    
  1. <?xml version="1.0" encoding="UTF-8"?> 
  2. <web-app version="2.5"   
  3. xmlns="http://java.sun.com/xml/ns/javaee"   
  4. xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"   
  5. xsi:schemaLocation="http://java.sun.com/xml/ns/javaee   
  6. http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"> 
  7.   <servlet> 
  8.     <description>This is the description of my J2EE component</description> 
  9.     <display-name>This is the display name of my J2EE component</display-name> 
  10.     <servlet-name>upload</servlet-name> 
  11.     <servlet-class>com.lis.upload.upload</servlet-class> 
  12.   </servlet> 
  13.  
  14.  
  15.   <servlet-mapping> 
  16.     <servlet-name>upload</servlet-name> 
  17.     <url-pattern>/servlet/upload</url-pattern> 
  18.   </servlet-mapping> 
  19.   <welcome-file-list> 
  20.     <welcome-file>index.jsp</welcome-file> 
  21.   </welcome-file-list> 
  22. </web-app> 

 
我已经将示例上传到csdn、51CTO上了
欢迎大家下载指正
51CTO下载地址: http://down.51cto.com/data/468185