- 浏览: 996635 次
- 性别:
- 来自: 广州
文章分类
- 全部博客 (394)
- OSGI (14)
- 多线程 (10)
- 数据库 (30)
- J2ME (1)
- JAVA基础知识 (46)
- 引用包 (1)
- 设计模式 (7)
- 工作流 (2)
- Ubuntu (7)
- 搜索引擎 (6)
- QT (2)
- Ubuntu下编程 (1)
- 小程序 (2)
- UML (1)
- Servlet (10)
- spring (16)
- IM (12)
- 文档视频转为flash格式在线播放 (19)
- Maven (8)
- 远程调用 (2)
- PHPRPC (1)
- EXTJS学习 (2)
- Hibernate (16)
- 技术文章 (38)
- flex (5)
- 海量数据处理 (5)
- FTP (8)
- JS (10)
- Struts (1)
- hibernate search (13)
- JQuery (2)
- EMail (3)
- 算法 (4)
- SVN (7)
- JFreeChart (4)
- 面试 (4)
- 正规表达式 (2)
- 数据库性能优化 (10)
- JVM (6)
- Http Session Cookie (7)
- 网络 (12)
- Hadoop (2)
- 性能 (1)
最新评论
-
hy1235366:
能够随便也发一下,你退火算法程序使用的DistanceMatr ...
模拟退火算法总结(含例子)(转) -
梅强强:
感谢分享。。帮大忙了
swftools转换文件时线程堵塞问题的解决方法 -
wenlongsust:
openoffice和文件不在同一个服务器上,用过吗?
[JODConverter]word转pdf心得分享(转) -
2047699523:
如何在java Web项目中开发WebService接口htt ...
利用Java编写简单的WebService实例 -
abingpow:
唉,看起来好像很详细很不错的样子,可惜不是篇面向初学者的文章, ...
Spring与OSGi的整合(二)(转)
该插件使用的是jQuery,Flash和后端(您选择哪种语言实现的上传)脚本的组合。
如何来使用它?
——执行此插件非常简单,只需在jQuery函数中调用即可,先快速让
此功能跑起来。
1、下载最新的zip压缩包 http://www.uploadify.com
2、从其中提取文件。
下载插件安装包后,可以看到官方给出的例子。里面文件夹的几个主要文件:jquery.uploadify.js(完成上传功能的脚本文件,在调用页面引用)、uploadify.css(外观样式表)、uploader.swf(上传控件的主体文件,flash控件)、upload.php(服务器端处理文件,官方仅提供了php版的)。(我下载的是jquery.uploadify-v2.1.0.zip,将解压后的文件除com和example文件夹外都加入到工程里去,文件结构与下图有所差别)
下面我使用的是在MyEclipse部署的java版。注意:需要加入三个commons.jar包。
3、导入default.css,uploadify.css,jQuery脚本,swfobject脚本和Uploadify插件。并且添加调用插件使用$,在您的网页的<head>部分ready事件:
<%@ page language="java" contentType="text/html; charset=utf-8"%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>Upload</title> <!--装载文件--> <link href="jquery/uploadify.css" rel="stylesheet" type="text/css" /> <script type="text/javascript" src="jquery/jquery-1.3.2.min.js"></script> <script type="text/javascript" src="jquery/swfobject.js"></script> <script type="text/javascript" src="jquery/jquery.uploadify.v2.1.0.min.js"></script> <!--ready事件--> <script type="text/javascript"> $(document).ready( function() { $("#uploadify").uploadify( {//初始化函数 'uploader' : 'uploadify.swf',//flash文件位置,注意路径 'script' : 'servlet/Upload',//后台处理的请求 'cancelImg' : 'jquery/cancel.png',//取消按钮图片 'folder' : 'jquery/uploadsFolder',//您想将文件保存到的路径,将auto设置为true里才有用,不然跳到类里去处理,那就那里说了算 'queueID' : 'fileQueue',//与下面的上传文件列表id对应 'queueSizeLimit' : 8,//上传文件的数量 'scriptData' : { 'a' : 'value1', 'b' : 'value2' },//向后台传的数据 'fileDesc' : 'rar文件或zip文件',//上传文件类型说明 // 'fileExt' :'*.rar;*.zip;*txt,*doc,*docx', //控制可上传文件的扩展名,启用本项时需同时声明fileDesc 'method' : 'get',//如果向后台传输数据,必须是get // 'sizeLimit':1000000,//文件上传的大小限制,单位是字节 'auto' : false,//是否自动上传 'multi' : true, 'simUploadLimit' : 8,//同时上传文件的数量,设置了这个参数后,那么你会因设置multi:true和queueSizeLimit:8而可以多选8个文件,但如果一旦你将simUploadLimit也设置了,那么只会上传这个参数指定的文件个数,其它就上传不了 'buttonText' : 'BROWSE',//浏览按钮图片 'onComplete' : function(event, queueID, fileObj, serverData, data) {//当上传完成后的回调函数,ajax方式哦~~ alert(data.speed); } }); }); </script> </head> <body> <div id="fileQueue"></div> <input type="file" name="uploadify" id="uploadify" /> <p> <a href="javascript:jQuery('#uploadify').uploadifyUpload()">开始上传</a> <a href="javascript:jQuery('#uploadify').uploadifyClearQueue()">取消所有上传</a> </p> </body> </html>
4、后台处理的upload.java
package com.xzit.upload; 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 + "/uploadsFolder/"; 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); } }
5、配置处理的servlet
<?xml version="1.0" encoding="UTF-8"?> <web-app version="2.5" xmlns="http://java.sun.com/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"> <!-- 上传的servlet配置 --> <servlet> <servlet-name>upload</servlet-name> <servlet-class>com.xzit.upload.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>
到这里就ok了哦,可用http://localhost:8080/UploadifyTest/index.jsp进行访问。
下篇将对插件的可选参数作详细地介绍,也可参考官方的参考文档。http://www.uploadify.com/documentation/
- UploadifyTest.rar (369.8 KB)
- 下载次数: 705
评论
3 楼
heymaomao
2012-01-06
偷别人的文章~~~
2 楼
qin_eye
2011-06-22
同志,太谢谢你了,找了好久好久啊 。。
1 楼
WindMill
2011-06-13
可以下载啊!haha
发表评论
-
提取html内容放入xml文件时空格问题
2011-05-24 17:09 2595由于项目的需要,将网站上的信息抓取下来,提取出想要的信息,然后 ... -
简述URI和URL区别(转)
2011-04-20 16:23 1372URL:(Uniform Resoure Locato ... -
jsp页面乱码解决方案及编码设置问题(转)
2011-03-27 15:46 1810经常遇到关于JSP页面乱码的问题,在网上也查了相关的帖子,故在 ... -
使用JSTL标签异常
2011-01-02 09:48 1821我使用JSTL标签,如下所示: <c:when ... -
HSQL入门及使用指南 (转)
2010-12-27 22:29 2127HSQL可以到官方网站 ... -
使用POI读取Word207和Excel2007的例子 (转)
2010-12-26 16:19 2579天在写全文检索功能时,POI读取Word2007和Excel2 ... -
SSH session连接关闭问题的解决(转)
2010-12-15 22:12 21082008-07-20 22:25:27,531 INF ... -
svn和myeclipse使用搜狗浏览器代理
2010-12-11 16:42 17861 在svn里的setting功能选项中选择Network,勾 ... -
Kissy Suggest 自动提示例子
2010-12-10 14:45 3779由淘宝团队开发出来的Kissy Suggest 自动提示组件是 ... -
计算机开机启动过程详解(转)
2010-12-10 13:22 13521、http://product.zdnet.com. ... -
更强的自动补全提示:提示补全组件:Kissy Suggest(转)
2010-12-09 16:25 1022去年针对谷歌的搜索提示,发过一篇文章:从谷歌的一个Bug说 ... -
磁盘分区与文件系统(转)
2010-12-09 09:38 2006一个磁盘是分成一个个扇区来存放信息,整个磁盘的第一个扇区是作 ... -
QQ通信原理(转)
2010-12-02 21:52 6623QQ通信原理我研究的是QQ ... -
邮件激活
2010-11-17 09:34 1419今天看了一下公司做的网站,看到有关邮件激活的程序,就做下笔记。 ... -
HttpSessionBindingListener获取在线用户数(转)
2010-11-01 14:59 2329下面为我的测试 ... -
cookie的简单使用
2010-10-29 11:13 1543一、cookie的作用 在 ... -
Cookie工作原理(转)
2010-10-29 09:30 1785Cookies基础 Cookies是 ... -
swfobject的使用
2010-10-26 09:54 31771 swfobject可以将swf文件嵌入到网页内,它是一个j ... -
java获取当前工程名(转)
2010-10-24 09:14 1585String projectname = System.get ... -
利用Java编写简单的WebService实例(转)
2010-10-22 15:30 2709/* * File name: TestHell ...
相关推荐
jsp使用uploadify插件实现文件上传的示例,测试时将uploadify 直接导入myeclipse就能用了。 uploadify是一个与jquery和flash结合实现的上传程序,界面挺漂亮,用起来也方便,不过浏览器需要安装有Flash插件,好像...
最近要用Servlet/JSP做一个上传功能demo供新人学习。我采用的是Apache提供的commons-fileupload jar包,以及jquery uploadify插件组合实现多文件上传,单文件上传等。
Jsp结合uploadify插件实现的批量多文件上传源码,多文件同时上传,可上传文件和图片,uploadify结合jQuery实现JSP下的无刷新图片上传、文件上传功能。*.rar;*.zip', //控制可上传文件的扩展名,启用本项时需同时声明...
使用Jquery.uploadify上传文件。...jquery有很多插件,其中也有不少上传文件的插件,像ajaxfileupload.js、uploadify.js,不过网上的例子几乎全是php的,很郁闷,研究了半天,终于把uploadify用jsp版本弄出来了
客户端使用了jquery的uploadify插件,显示多文件的一步上传. 实时显示上传比例. 有着漂亮的界面. 演示效果:http://www.uploadify.com/demo/ 后台使用了Apache的Commons fileUpload 来完成对上传文件的读取与保存 ...
jsp uploadify插件上传,项目有用到的朋友欢迎下载,实时uploadify官网下载的东西,对应的jquery版本比较高。
使用uploadify插件可方便实现图片上传功能。兼容ie6、ie7。 上传成功之后使用插件的回调函数读取json数据,根据url实现图片预览。 效果图: 点击浏览文件上传图片,图片依次在右侧显示预览效果。 实现: json数据...
这是一个jquery的插件上传,可以显示上传的进度 详情请参考:http://www.uploadify.com/ 改文件是一个jsp上传的demo
今天整理了一个jsp附件上传模块,结合jquery Uploadify插件,可以一次性上传多个附件,而且自带上传进度功能,非常漂亮的界面和强大的功能。 Uploadify插件是由国外开发的一个jquery插件,功能非常的齐全,包括同时...
之所以要选择uploadify,是源于自己先前使用过jQuery官网的上传文件插件,比较难用(页面写的代码比较多,IE下后台回传需要配置格式【不清楚其他上传插件是否也是这样】),而且一直有IE9上传不成功的问题,到我离开...
今天整理了一个jsp附件上传模块,结合jquery Uploadify插件,可以一次性上传多个附件,而且自带上传进度功能,非常漂亮的界面和强大的功能。 Uploadify插件是有国外开发的一个jquery插件,功能非常的齐全,包括同时...
—》最近由于项目需要使用到一个上传插件,在网上发现uploadify挺不错,所以决定使用它,但是官网文档和例子是php的,而项目是SSI框架的,所以自己对uploadify在struts2中的使用进行了一番研究,最终实现了。...
j2ee给图片加上图片或文字水印,还使用了Jquery上传插件Uploadify上传图片
使用Jquery.uploadify上传文件。...jquery有很多插件,其中也有不少上传文件的插件,像ajaxfileupload.js、uploadify.js,不过网上的例子几乎全是php的,很郁闷,研究了半天,终于把uploadify用jsp版本弄出来了
style一、框架使用:1、后台框架:使用spring+spring mvc+hibernate jpa。2、前台框架:使用bootstrap V2。二、主要内容(持续更新。...4、异步上传插件uploadify的运用。5、前台验证框架jquery.validate的使用。