uploadify的官方网站
http://www.uploadify.com,文档以及插件均可从此网站下载到。
示例代码如下:
1.JSP文件:
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>文件上传演示</title>
<link href="css/uploadify.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="js/jquery1.6.1.js"></script>
<script language="javascript" src="js/swfobject.js"></script>
<script language="javascript" src="js/jquery.uploadify.v2.1.0.min.js"></script>
<script type="text/javascript">
function showResult(){//删除显示的上传成功结果
$("#result").html("");
}
$(document).ready(function() {
$('#fileInput').uploadify({
'uploader': 'js/swf/uploadify.swf',
'script': 'uploadifyAction.action', //指定服务端处理类的入口
'folder': 'uploadFile',
'fileDataName': 'fileInput', //和input的name属性值保持一致就好,Struts2就能处理了
'queueID': 'fileQueue',
'auto': false,//是否选取文件后自动上传
'multi': true,//是否支持多文件上传
'simUploadLimit' : 5,//每次最大上传文件数
//'buttonImg': 'images/btn.gif',//按钮上的图片
'buttonText': 'File',//按钮上的文字
'onComplete': function (event, queueID, fileObj, response, data) {
$("#result").html(response);//显示上传成功结果
//setInterval("showResult()",2000);//两秒后删除显示的上传成功结果
}
});
});
</script>
</head>
<body>
<input type="file" name="fileInput" id="fileInput" />
<a href="javascript:$('#fileInput').uploadifyUpload();">开始上传</a>
<div id="result"></div>
<a href="javascript:$('#fileInput').uploadifyClearQueue();" >取消上传队列</a>
<div id="fileQueue"></div>
<!--显示结果-->
</body>
</html>
属性解说:
uploader: swf文件的存放位置,默认为uploadify.swf。
这个属性一定要配置好,如果不配置好,插件就会去寻找与jsp同级的一个叫做uploadify.swf的文件,如果找不到,上传按钮处会显示一片空白。
script: 'uploadifyAction.action',指定服务端处理类的入口
fileDataName:网页中的文件选择标签
auto:是否选取文件之后自动上传
buttonImg:按钮图片(不推荐使用),这是在页面加载完成之后,flash再从网页中取得图片,将图片填充到swf里面,所以
按钮都会在页面刷新好以后几秒钟才加载完成。
buttonText:(推荐使用),选择文件按钮就是一个黑色按钮,如果对样式没什么要求的话就用这个属性,但是只能使用英文,用中文的话不能正常显示。
2.后台处理程序(UploadFileDemoAction.java)
package com.sun.demoAction;
import java.io.BufferedInputStream;
import java.io.BufferedOutputStream;
import java.io.File;
import java.io.FileInputStream;
import java.io.FileNotFoundException;
import java.io.FileOutputStream;
import java.io.IOException;
import java.io.InputStream;
import java.io.OutputStream;
import javax.servlet.http.HttpServletResponse;
import org.apache.struts2.ServletActionContext;
import com.opensymphony.xwork2.ActionSupport;
public class UploadFileDemoAction extends ActionSupport {
private static final int BUFFERED_SIZE = 4 * 1024;
private File fileInput;
private String fileInputFileName;
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;
}
public void uploadFile() {
HttpServletResponse response = null;
try {
System.out.println("uploadFile:");
System.out.println("上传文件的位置:" + fileInput.getAbsolutePath());
System.out.println("上传文件的名称:" + fileInputFileName);
// 将文件存到D盘下
File imageFile = new File("D:\\" + fileInputFileName);
copy(fileInput, imageFile);
// 返回成功信息
response = ServletActionContext.getResponse();
response.setCharacterEncoding("utf-8");
response.getWriter().println("OK,FIlE:" + fileInputFileName + "");
} catch (Exception e) {
try {
response = ServletActionContext.getResponse();
response.getWriter().println("Error,FIlE:" + fileInputFileName + "");
} catch (IOException e1) {
e1.printStackTrace();
}
}
}
private static void copy(File src, File target) {
InputStream in = null;
OutputStream out = null;
try {
in = new BufferedInputStream(new FileInputStream(src), BUFFERED_SIZE);
out = new BufferedOutputStream(new FileOutputStream(target), BUFFERED_SIZE);
byte[] bs = new byte[BUFFERED_SIZE];
int i;
while ((i = in.read(bs)) > 0) {
out.write(bs, 0, i);
}
} catch (FileNotFoundException e) {
e.printStackTrace();
} catch (IOException e) {
e.printStackTrace();
} finally {
try {
if (in != null)
in.close();
if (out != null)
out.close();
} catch (IOException e) {
e.printStackTrace();
}
}
}
}
Action里面的属性跟用struts2上传文件类似,也是文件选择框fileInput以及fileInputFileName的get/set方法。
3. struts2配置文件(struts.xml)
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE struts PUBLIC "-//Apache Software Foundation//DTD Struts Configuration 2.1//EN" "http://struts.apache.org/dtds/struts-2.1.dtd">
<struts>
<constant name="struts.i18n.encoding" value="utf-8"></constant>
<!-- 设置最大上传的大小 -->
<constant name="struts.multipart.maxSize" value="4000194304"/>
<package name="uploadfile" namespace="/" extends="struts-default">
<action name="uploadifyAction" class="com.sun.demoAction.UploadFileDemoAction" method="uploadFile">
</action>
</package>
</struts>
分享到:
相关推荐
《jQuery文件上传插件jQuery.uploadify.js:跨越浏览器限制的智能解决方案》 在Web开发中,文件上传功能是一项常见的需求,而jQuery.uploadify.js是一款高效且用户友好的文件上传插件,尤其对于需要兼容多种浏览器...
### 使用jQuery Uploadify 3.0进行文件上传的详尽指南 #### 一、简介 jQuery Uploadify是一款基于Flash技术的文件上传插件,旨在简化前端文件上传过程,提供友好的用户界面。此插件支持多种文件上传方式,并且可以...
总之,本项目展示了如何将前端的jQuery Uploadify插件与Java后端相结合,实现一个高效且用户友好的批量文件上传功能。对于想要学习这一领域的开发者来说,这是一个很好的实践案例。通过深入研究此项目,你可以了解到...
在IT行业中,jQuery Uploadify.js是一款非常流行的前端文件上传插件,它允许用户通过异步方式上传文件到服务器,提供了一种友好的用户体验。然而,随着浏览器版本的更新,一些较旧的插件可能不再兼容新的浏览器,...
标题中的"JQuery_uploadify_struts2_jsp__ajax多文件上传"涉及到的是一个使用jQuery、uploadify插件、Struts2和JSP技术实现的AJAX多文件上传功能。这个功能允许用户在不刷新页面的情况下,上传多个文件到服务器。 ...
首先,jQuery Uploadify是基于jQuery的一个插件,它支持多文件上传、预览、取消上传、进度条显示等功能。其核心在于通过Flash技术实现实时反馈上传进度,从而让用户了解文件上传的状态。 在开始之前,确保你已经...
总之,结合jQuery Uploadify插件和PHP,我们可以构建一个功能强大、易于使用的文件上传系统。通过理解Uploadify的工作原理和PHP的文件处理机制,我们可以定制满足特定需求的上传功能,同时保证系统的安全性和稳定性...
在.NET开发中,文件上传是一项常见的任务,而jQuery Uploadify插件则为这一过程提供了便捷的解决方案。Uploadify是一款基于JavaScript和Flash的文件上传组件,它允许用户通过拖拽或选择文件的方式,实现多文件同时...
接下来是`jquery.uploadify.js`和`jquery.uploadify.min.js`,这两个文件分别是未压缩和压缩版本的Uploadify插件主脚本。它们实现了文件选择、上传逻辑以及与服务器端的通信。`jquery.uploadify.min.js`更适合生产...
总之,jQuery Uploadify插件v3.0.0是一个强大且灵活的文件上传解决方案,它简化了前端与后端的文件交互,提升了用户体验。通过理解和掌握其配置与用法,开发者可以在项目中轻松实现高效的文件上传功能。
总的来说,jQuery Uploadify是一个强大且易于使用的多文件上传解决方案,它可以帮助开发者轻松实现文件上传功能,同时提供了丰富的定制选项以满足不同的需求。无论你是新手还是经验丰富的开发者,都能从这个插件中...
使用Jquery的上传插件Uploadify,提供upload.ashx的C#源码和VB源码,方便直接使用,因为不会VB,所以只使用C#做了上传的示例。在web.config中配置上传的文件夹路径! 示例的主要功能是创建一个新的文件夹并将文件...
在Web开发中,上传功能是不可或缺的一部分,而jQuery.uploadify插件以其强大的功能和易用性深受开发者喜爱。这个"jquery.uploadify-v2.1.4[修正版]"正是基于官方的v2.1.4版本进行了一次关键的优化,特别针对中文支持...
jsp使用uploadify插件实现文件上传的示例,测试时将uploadify 直接导入myeclipse就能用了。 uploadify是一个与jquery和flash结合实现的上传程序,界面挺漂亮,用起来也方便,不过浏览器需要安装有Flash插件,好像...
在IT行业中,前端开发经常会遇到文件上传的需求,而"jquery-java-ajax-uploadify上传文件"是一个经典的方法,结合了JavaScript库jQuery、Ajax技术以及Uploadify插件来实现这一功能。在这个过程中,我们将深入探讨...
Uploadify是一款基于jQuery的文件上传插件,版本为3.2.1,它极大地简化了在Web应用中实现异步无刷新多文件上传的过程。...通过研究这些内容,开发者可以快速理解和使用Uploadify插件,实现高效、便捷的文件上传功能。