jquery上传之Uploadify

最新推荐文章于 2022-09-13 10:48:41 发布

Tankpt

最新推荐文章于 2022-09-13 10:48:41 发布

阅读量1.1k

点赞数

分类专栏： jquery 文章标签： jQuery 上传

jquery 专栏收录该内容

6 篇文章 0 订阅

订阅专栏

貌似同学尝试了2.多的版本。最后说不好用。貌似现在更新到3.多的版本了。昨天百度了下。折腾了一天。终于差不多弄好了

原文地址http://blog.csdn.net/tianba8/article/details/9953383#comments 感谢这位博主的整理。

另外付上几个参考的文章

1.貌似翻译的API：http://www.yauld.cn/uploadifydoc/

2.http://wallimn.iteye.com/blog/1663299

3.http://blog.csdn.net/dracotianlong/article/details/8770314

4http://sauzny.iteye.com/blog/1907523

5http://tangsong1005.blog.163.com/blog/static/168966094201091544518156/

jsp如下

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>My JSP 'index.jsp' starting page</title>
    
<script src="scripts/jquery.min.js" type="text/javascript"></script>
<script src="uploadify/jquery.uploadify.js" type="text/javascript"></script>
<link rel="stylesheet" type="text/css" href="uploadify/uploadify.css">
	<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->
		<script type="text/javascript">
	$(document).ready(
			function() {        
				$("#uploadify").uploadify( {//初始化函数
				'swf'      : 'uploadify/uploadify.swf',
				'auto'     : false,//true为自动上传
				'uploader' : 'servlet/Upload',
				'multi' : true,
				'buttonText' : '浏览',
				'simUploadLimit' : 8
			});

		});	
</script>
  </head>
  
  <body>
		<div id="fileQueue"></div>
		<input type="file" name="uploadify" id="uploadify" />
		<p>
			<a href="javascript:jQuery('#uploadify').uploadify('upload','*')">开始上传</a> 
			<a href="javascript:jQuery('#uploadify').uploadify('cancel','*')">取消所有上传</a>
		</p>   
  </body>
</html>

SECERLET如下

package com.zcb.servlet;  
import java.io.File;  
import java.io.IOException;  
import java.util.Iterator;  
import java.util.List;  
import java.util.UUID;  
import javax.servlet.ServletException;  
import javax.servlet.http.HttpServlet;  
import javax.servlet.http.HttpServletRequest;  
import javax.servlet.http.HttpServletResponse;  
import org.apache.commons.fileupload.FileItem;  
import org.apache.commons.fileupload.FileUploadException;  
import org.apache.commons.fileupload.disk.DiskFileItemFactory;  
import org.apache.commons.fileupload.servlet.ServletFileUpload;  
/** 
 *  
 * @author zhengchubin 
 * 
 */  
@SuppressWarnings("serial")  
public class Upload extends HttpServlet {  
    @SuppressWarnings("unchecked")  
    public void doPost(HttpServletRequest request, HttpServletResponse response)  
            throws ServletException, IOException {  
        String savePath = this.getServletConfig().getServletContext()  
                .getRealPath("");  
        savePath = savePath + "/uploads/";  
        File f1 = new File(savePath);  
        System.out.println(savePath);  
        if (!f1.exists()) {  
            f1.mkdirs();  
        }  
        DiskFileItemFactory fac = new DiskFileItemFactory();  
        ServletFileUpload upload = new ServletFileUpload(fac);  
        upload.setHeaderEncoding("utf-8");  
        List fileList = null;  
        try {  
            fileList = upload.parseRequest(request);  
        } catch (FileUploadException ex) {  
            return;  
        }  
  
        Iterator<FileItem> it = fileList.iterator();  
        String name = "";  
        String extName = "";  
        while (it.hasNext()) {  
            FileItem item = it.next();  
            if (!item.isFormField()) {  
                name = item.getName();  
                long size = item.getSize();  
                String type = item.getContentType();  
                System.out.println(size + " " + type);  
                if (name == null || name.trim().equals("")) {  
                    continue;  
                }  
  
                //扩展名格式：   
                if (name.lastIndexOf(".") >= 0) {  
                    extName = name.substring(name.lastIndexOf("."));  
                }  
  
                File file = null;  
                //用于判断生成的文件名是否已经存在  
                do {  
                    //生成文件名：  
                    name = UUID.randomUUID().toString();  
                    file = new File(savePath + name + extName);  
                } while (file.exists());  
                File saveFile = new File(savePath + name + extName);  
                try {  
                    item.write(saveFile);  
                } catch (Exception e) {  
                    e.printStackTrace();  
                }  
            }  
        }  
        response.getWriter().print(name + extName);  
    }  
}

最后是配置

<servlet>  
    <servlet-name>upload</servlet-name>  
    <servlet-class>com.zcb.servlet.Upload</servlet-class>  
</servlet>  
<servlet-mapping>  
    <servlet-name>upload</servlet-name>  
    <url-pattern>/servlet/Upload</url-pattern>  
</servlet-mapping>  
 <welcome-file-list>  
   <welcome-file>index.jsp</welcome-file>  
 </welcome-file-list>

ok打完收功。。我当时看的时候貌似取消的那个按钮的图片没显示出来。这个东西在源文件css里去修改下就ok了。现在就是在用这个