摘自:http://itindex.net/detail/47160-java-jquery-%E4%B8%8A%E4%BC%A0

运行效果:

包结构图:

后台JAVA逻辑:

package com.bijian.study;

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; @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);
}
}

web.xml:

<?xml version="1.0" encoding="UTF-8"?>
<web-app version="2.4" xmlns="http://java.sun.com/xml/ns/j2ee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://java.sun.com/xml/ns/j2ee
http://java.sun.com/xml/ns/j2ee/web-app_2_4.xsd"> <servlet>
<servlet-name>upload</servlet-name>
<servlet-class>com.bijian.study.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>
</web-app>

 

index.jsp:

<%@ page language="java" contentType="text/html; charset=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>Upload</title> <!--装载文件-->
<link href="css/uploadify.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="uploadify/jquery-1.9.1.js"></script>
<script type="text/javascript" src="uploadify/jquery.uploadify.min.js"></script> <!--ready事件-->
<script type="text/javascript">
$(document).ready(function() {
$("#uploadify").uploadify({
'uploader' : 'servlet/Upload',
'swf' : 'uploadify/uploadify.swf',
'cancelImg' : 'img/uploadify-cancel.png',
'folder' : 'uploads',//您想将文件保存到的路径
'queueID' : 'fileQueue',//与下面的id对应
'queueSizeLimit' : 5,
'fileDesc' : 'rar文件或zip文件',
'fileExt' : '*.rar;*.zip', //控制可上传文件的扩展名,启用本项时需同时声明fileDesc
'auto' : false,
'multi' : true,
'simUploadLimit' : 2,
'buttonText' : '选择文件',
'onDialogOpen' : function() {//当选择文件对话框打开时触发
alert( 'Open!');
},
'onSelect' : function(file) {//当每个文件添加至队列后触发
alert( 'id: ' + file.id
+ ' - 索引: ' + file.index
+ ' - 文件名: ' + file.name
+ ' - 文件大小: ' + file.size
+ ' - 类型: ' + file.type
+ ' - 创建日期: ' + file.creationdate
+ ' - 修改日期: ' + file.modificationdate
+ ' - 文件状态: ' + file.filestatus);
},
'onSelectError' : function(file,errorCode,errorMsg) {//当文件选定发生错误时触发
alert( 'id: ' + file.id
+ ' - 索引: ' + file.index
+ ' - 文件名: ' + file.name
+ ' - 文件大小: ' + file.size
+ ' - 类型: ' + file.type
+ ' - 创建日期: ' + file.creationdate
+ ' - 修改日期: ' + file.modificationdate
+ ' - 文件状态: ' + file.filestatus
+ ' - 错误代码: ' + errorCode
+ ' - 错误信息: ' + errorMsg);
},
'onDialogClose' : function(swfuploadifyQueue) {//当文件选择对话框关闭时触发
if( swfuploadifyQueue.filesErrored > 0 ){
alert( '添加至队列时有'
+swfuploadifyQueue.filesErrored
+'个文件发生错误n'
+'错误信息:'
+swfuploadifyQueue.errorMsg
+'n选定的文件数:'
+swfuploadifyQueue.filesSelected
+'n成功添加至队列的文件数:'
+swfuploadifyQueue.filesQueued
+'n队列中的总文件数量:'
+swfuploadifyQueue.queueLength);
}
},
'onQueueComplete' : function(stats) {//当队列中的所有文件全部完成上传时触发
alert( '成功上传的文件数: ' + stats.successful_uploads
+ ' - 上传出错的文件数: ' + stats.upload_errors
+ ' - 取消上传的文件数: ' + stats.upload_cancelled
+ ' - 出错的文件数' + stats.queue_errors);
},
'onUploadComplete' : function(file,swfuploadifyQueue) {//队列中的每个文件上传完成时触发一次
alert( 'id: ' + file.id
+ ' - 索引: ' + file.index
+ ' - 文件名: ' + file.name
+ ' - 文件大小: ' + file.size
+ ' - 类型: ' + file.type
+ ' - 创建日期: ' + file.creationdate
+ ' - 修改日期: ' + file.modificationdate
+ ' - 文件状态: ' + file.filestatus);
},
'onUploadError' : function(file,errorCode,errorMsg,errorString,swfuploadifyQueue) {//上传文件出错是触发(每个出错文件触发一次)
alert( 'id: ' + file.id
+ ' - 索引: ' + file.index
+ ' - 文件名: ' + file.name
+ ' - 文件大小: ' + file.size
+ ' - 类型: ' + file.type
+ ' - 创建日期: ' + file.creationdate
+ ' - 修改日期: ' + file.modificationdate
+ ' - 文件状态: ' + file.filestatus
+ ' - 错误代码: ' + errorCode
+ ' - 错误描述: ' + errorMsg
+ ' - 简要错误描述: ' + errorString);
},
'onUploadProgress' : function(file,fileBytesLoaded,fileTotalBytes,queueBytesLoaded,swfuploadifyQueueUploadSize) {//上传进度发生变更时触发
alert( 'id: ' + file.id
+ ' - 索引: ' + file.index
+ ' - 文件名: ' + file.name
+ ' - 文件大小: ' + file.size
+ ' - 类型: ' + file.type
+ ' - 创建日期: ' + file.creationdate
+ ' - 修改日期: ' + file.modificationdate
+ ' - 文件状态: ' + file.filestatus
+ ' - 当前文件已上传: ' + fileBytesLoaded
+ ' - 当前文件大小: ' + fileTotalBytes
+ ' - 队列已上传: ' + queueBytesLoaded
+ ' - 队列大小: ' + swfuploadifyQueueUploadSize);
},
'onUploadStart': function(file) {//上传开始时触发(每个文件触发一次)
alert( 'id: ' + file.id
+ ' - 索引: ' + file.index
+ ' - 文件名: ' + file.name
+ ' - 文件大小: ' + file.size
+ ' - 类型: ' + file.type
+ ' - 创建日期: ' + file.creationdate
+ ' - 修改日期: ' + file.modificationdate
+ ' - 文件状态: ' + file.filestatus );
},
'onUploadSuccess' : function(file,data,response) {//上传完成时触发(每个文件触发一次)
alert( 'id: ' + file.id
+ ' - 索引: ' + file.index
+ ' - 文件名: ' + file.name
+ ' - 文件大小: ' + file.size
+ ' - 类型: ' + file.type
+ ' - 创建日期: ' + file.creationdate
+ ' - 修改日期: ' + file.modificationdate
+ ' - 文件状态: ' + file.filestatus
+ ' - 服务器端消息: ' + data
+ ' - 是否上传成功: ' + response);
}
});
});
</script>
</head> <body>
<div id="fileQueue"></div>
<input type="file" name="uploadify" id="uploadify" />
<p>
<!-- 上传第一个未上传的文件 -->
<a href="javascript:$('#uploadify').uploadify('upload')">上传</a>
<!-- 取消第一个未取消的文件 -->
<a href="javascript:$('#uploadify').uploadify('cancel')">取消上传</a> <a href="javascript:$('#uploadify').uploadify('upload','*')">开始上传所有文件</a>&nbsp;
<a href="javascript:$('#uploadify').uploadify('cancel','*')">取消所有上传</a>
</p>
</body>
</html>

java版-JQuery上传插件Uploadify使用实例的更多相关文章

  1. JQuery上传插件uploadify优化

    旧版的uploadify是基于flash上传的,但是总有那么些问题,让我们用的不是很舒服.今天主要分享下在项目中用uploadify遇到的一些问题,以及优化处理 官方下载 官方文档 官方演示 下面是官 ...

  2. jquery上传插件uploadify 报错http error 302 解决方法之一

    前段时间用到jquery上传插件uploadify时,始终出现系统报出 http error 302 的错误. 网上大量搜集信息,基本上都是说session值丢失的问题,根据网友提供的解决方案进行修改 ...

  3. 【转】JQuery上传插件Uploadify使用详解及错误处理

    转自:http://www.jb51.net/article/43498.htm 关于JQuery上传插件Uploadify使用详解网上一大把,基本上内容都一样.我根据网上的步骤配置完成后,会报一些错 ...

  4. JQuery上传插件Uploadify使用详解 asp.net版

    先来一个实例 Uploadify插件是JQuery的一个文件支持多文件上传的上传插件,ajax异步上传,实现的效果非常不错,带进度显示.不过官方提供的实例时php版本的,本文将详细介绍Uploadif ...

  5. jQuery上传插件Uploadify使用帮助

    Uploadify是JQuery的一个上传插件,实现的效果非常不错,带进度显示.它的功能特色总结如下: 支持单文件或多文件上传,可控制并发上传的文件数 在服务器端支持各种语言与之配合使用,诸如PHP, ...

  6. JQuery上传插件Uploadify使用详解

    本文转载http://www.cnblogs.com/oec2003/archive/2010/01/06/1640027.html Uploadify是JQuery的一个上传插件,实现的效果非常不错 ...

  7. (转)JQuery上传插件Uploadify使用详解

    原文地址:http://www.cnblogs.com/oec2003/archive/2010/01/06/1640027.html Uploadify是JQuery的一个上传插件,实现的效果非常不 ...

  8. jQuery上传插件Uploadify使用介绍

    以图纸资料上传为例,介绍Uploadify插件的使用,插件下载地址   http://www.uploadify.com/download/ 上传页面: 选择文件增加未上传界面: 上传成功预览界面: ...

  9. 文件上传利器JQuery上传插件Uploadify

    在做日常项目中,经常在后台需要上传图片等资源文件,之前使用过几次这个组件,感觉非常好用 ,但是每次使用的时候都是需要经过一番查阅,所以还不如记住在这里,以后使用的时候就翻翻. 他的官方网站如下:htt ...

随机推荐

  1. validatebox验证框架rules

    项目前端使用JQuery easyui框架,验证使用插件validatebox,验证方法如下: <input name="test" type="text" ...

  2. 深入理解 静态类和静态字段(C# 基础)

    序言 以前,总是被提醒,在编程过程中尽量少用静态变量,数据丢失什么的,今天有空,禁不住对静态变量的强烈好奇,跟我一起了解下静态家族的内幕吧. 静态类 定义 静态类与非静态类的重要区别在于静态类不能实例 ...

  3. EF有外键的查询

    modelBuilder.Entity<ActionMenu>().ToTable("ActionMenu"); modelBuilder.Entity<Acti ...

  4. Effective Java2读书笔记-对于所有对象都通用的方法(二)

    第10条:始终要覆盖toString 这一条没什么好讲的,就是说默认的toString方法打印出来的是类名+@+十六进制哈希码的值.我们应该覆盖它,使它能够展示出一些更为详细清晰的信息,这个看实际情况 ...

  5. WPF利用Image实现图片按钮

    之前有一篇文章也是采用了Image实现的图片按钮,不过时间太久远了,忘记了地址.好吧,这里我进行了进一步的改进,原来的文章中需要设置4张图片,分别为可用时,鼠标悬浮时,按钮按下时,按钮不可用时的图片, ...

  6. Android CursorAdapter

    CursorAdapter 继承于BaseAdapter是个虚类,它为cursor和ListView提供了连接的桥梁.            public abstract class     Cur ...

  7. 【转】Android出现“Read-only file system”解决办法

    原文网址:http://www.111cn.net/sj/android/44496.htm 下面介绍一篇Android出现“Read-only file system”解决办法 有碰到这类问题的朋友 ...

  8. 【转】 树莓派学习笔记——I2C设备载入和速率设置

    原文网址:http://blog.csdn.net/xukai871105/article/details/18234075 1.载入设备 方法1——临时载入设备 sudo modprobe -r i ...

  9. POJ3261-哈希

    这个题让求至少出现K次的最大长度的子串,属于最大化最小值问题,首先应该想到二分求字串的长度,二分的过程是O(logN)的,注意judge的时候怎样判断是否满足情况以及满足情况后l,r的变化.可以给每一 ...

  10. (转载)关于#pragma pack(push,1)和#pragma pack(1)

    转载http://www.rosoo.net/a/201203/15889.html 一.#pragma pack(push,1)与#pragma pack(1)的区别 这是给编译器用的参数设置,有关 ...