你先要下载uploadify插件的一个版本,例如:jquery.uploadify-v2.1.0.zip,解压得到其中的几个关键文件即可开始下面的示例。
上传显示页面<uploadFileDemo.jsp>的代码:
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<style type="text/css">
body {
font: 12px/16px Arial, Helvetica, sans-serif;
}
#fileQueue {
width: 400px;
height: 300px;
overflow: auto;
border: 1px solid #E5E5E5;
margin-bottom: 10px;
}
</style>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>文件上传演示</title>
<link href="/xndt/include/css/uploadify.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="/xndt/include/js/jquery1.4.2.js" ></script>
<script language="javascript" src="/xndt/include/js/jquery.uploadify.swfobject.js"></script>
<script language="javascript" src="/xndt/include/js/jquery.uploadify.js"></script>
<script type="text/javascript">
function showResult(){//删除显示的上传成功结果
$("#result").html("");
}
$(document).ready(function() {
$('#fileInput').uploadify({
'uploader' : '/xndt/include/swf/uploadify.swf',
'script': '/xndt/uploadifyAction!uploadFile.action', //指定服务端处理类的入口
'folder': 'temp',
'cancelImg' : '/xndt/images/cancel.png',
'fileDataName': 'fileInput', //和input的name属性值保持一致就好,Struts2就能处理了
'queueID': 'fileQueue',
'auto': false,//是否选取文件后自动上传
'multi': true,//是否支持多文件上传
'simUploadLimit' : 5,//每次最大上传文件数
'buttonText': 'Browse Files',//按钮上的文字
'displayData': 'percentage',//有speed和percentage两种,一个显示速度,一个显示完成百分比
'onComplete': function (event, queueID, fileObj, response, data){
$("#result").html(response);//显示上传成功结果
setInterval("showResult()",2000);//两秒后删除显示的上传成功结果
}
});
});
</script>
</head>
<body>
<div id="fileQueue"></div>
<input type="file" name="fileInput" id="fileInput" />
<a href="javascript:$('#fileInput').uploadifyUpload();" >开始上传</a>
<a href="javascript:$('#fileInput').uploadifyClearQueue();" >取消上传队列</a> <br> <br>
<div id="result"></div><!--显示结果-->
</body>
</html>
服务端处理类<UploadFileDemoAction.java>的代码
package com.sun.demoAction;
import java.io.File;
import java.text.SimpleDateFormat;
import java.util.Date;
import javax.servlet.http.HttpServletResponse;
import org.apache.struts2.ServletActionContext;
import com.opensymphony.xwork2.ActionSupport;
public class UploadFileDemoAction extends ActionSupport {
private File fileInput;
private String fileInputFileName;//Struts2的拦截器FileUploadInterceptor根据请求对象中参数"fileInput"来自行生产的一个固有属性
public File getFileInput() {
return fileInput;
}
public void setFileInput(File fileInput) {
this.fileInput = fileInput;
}
public String getFileInputFileName() {
return fileInputFileName;
}
public void setFileInputFileName(String fileInputFileName) {
this.fileInputFileName = fileInputFileName;
}
@SuppressWarnings("deprecation")
public String uploadFile() throws Exception {
String savePath = ServletActionContext.getRequest().getRealPath("");
savePath = savePath + "/uploadFile/";
String extName = "";//扩展名
String newFileName= "";//新文件名
System.out.println("原文件名称:" + fileInputFileName);
//获取扩展名
if(fileInputFileName.lastIndexOf(".") > -1){
extName = fileInputFileName.substring(fileInputFileName.lastIndexOf("."));
}
String nowTime = new SimpleDateFormat("yyyyMMddHHmmssSSS").format(new Date());//当前时间
newFileName = nowTime + extName;
System.out.println("保存的文件名称:" + savePath + newFileName);
fileInput.renameTo(new File(savePath + newFileName));
HttpServletResponse response = ServletActionContext.getResponse();
response.setCharacterEncoding("utf-8");
response.getWriter().print("成功上传文件《" + fileInputFileName + "》!");
return null; //这里不需要页面转向,所以返回空就可以了
}
}
该Action的在XML中的映射信息:
<action name="uploadifyAction" class="com.sun.demoAction.UploadFileDemoAction" method="uploadFile"/>
注意事项:
1:需要去重写struts2的配置文件struts.properties中的以下属性的值,
例如:
struts.multipart.saveDir=d:/aaa // 设置Struts2的拦截器FileUploadInterceptor处理过程中临时文件的存放路径
struts.multipart.maxSize=4294967296 // 设置上传文件大小,最大支持到4GB
struts.multipart.parser=jakarta
分享到:
相关推荐
struts2+jquery.uploadify实现上传下载
struts2+jquery实现文件的上传
采用jquery.uploadify插件作为前台上传,服务台用c#异步处理
Asp.net 上传 Jquery.Uploadify HTML控件+Jquery.Uploadify 支持一次上传多个文件
uploadfiy这个插件是基于js里面的jquery库写的。结合了ajax和flash,实现了这个多线程上传的功能。
给予jQuery的文件上传插件:jquery.uploadify.js修复了IE9 IE10浏览按钮点击无效的bug;直接替换官网下载的jquery.uploadify.js文件即可使用。
jquery文件上传插件 jquery.uploadify.js 不支持IE10现在经过修改,已经支持IE6、IE7、IE8、IE9、IE10、IE11.zip
主要介绍了php+jQuery.uploadify实现文件上传教程,需要的朋友可以参考下
jquery.uploadify-3.1.min.js 修改了SWFUpload.prototype.getFlashHTML ()方法,解决了在ie9在点击上传按钮后,不能弹出浏览文件的对话框问题。
该uploadify为目前官网最新版本,由鄙人修改后,可以支持buttonText属性为中文
解决 jquery.uploadify.js 在ie9 下 二次打开失效问题等问题
ASP.NET jquery.uploadify文件上传控件测试项目(已解决中文乱码)
struts2 +jquey uploadify3 2 实现多文件上传 可以运行的myeclipse工程 绝对好用 访问方式http: 127 0 0 1:8080 Struts2Uploadify upload jsp uploadify 使用说明: <a href "javascript:$ "#file ...
jquery.uploadify.v2.1.0.js 上传
HTML5 PHP jquery uploadify上传文件,带进度条,author:吕大豹。仿照uploadify写的,www.codesc.net已做过修正,本例的配置参数均与uploadify官网一致,参照官网的api就可以了,直接把文件夹上传到支持php的服务器...
件上传是很多项目都会使用到的功能,SpringMVC当然也提供了这个功能。不过小编不建议在项目中通过form...下面这篇文章主要介绍了利用SpringMVC + jquery.uploadify实现上传文件功能的相关资料,需要的朋友可以参考下。
多文件上传,jquery实现的!很好用!
Vs2010下,采用jQuery.Uploadify 实现多文件上传的DEMO,没有多余的代码。
使用Jquery.uploadify上传文件。 jquery有很多插件,其中也有不少上传文件的插件,像ajaxfileupload.js、uploadify.js,不过网上的例子几乎全是php的,很郁闷,研究了半天,终于把uploadify用jsp版本弄出来了