`

uploadify 文件上传实例

阅读更多
  1. 插件官方地址 http://www.uploadify.com/
  2. 下载解压获得:cancel.png、jquery.uploadify.v2.1.0.js、swfobject.js、uploadify.css、uploadify.swf
  3. 放到 webRoot/js/uploadify  下
<%@ 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>Upload</title>
    
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	
	<link rel="stylesheet" type="text/css" href="<%=basePath %>js/uploadify/uploadify.css"/>
	<script type="text/javascript" src="<%=basePath %>js/jquery-1.2.6.min.js"></script>
	<script type="text/javascript" src="<%=basePath %>js/uploadify/swfobject.js"></script>
	<script type="text/javascript" src="<%=basePath %>js/uploadify/jquery.uploadify.v2.1.0.js"></script> 
	
	<script type="text/javascript">
        $(document).ready(function() {
            $("#file").uploadify({
                /*注意前面需要书写path的代码*/
                'uploader'       : '<%=basePath%>js/uploadify/uploadify.swf',
                'script'         : '<%=basePath%>UploadAction.do',
                'cancelImg'      : '<%=basePath%>js/uploadify/cancel.png',
                'queueID'        : 'fileQueue', //和存放队列的DIV的id一致
                'fileDataName'   : 'file', //和以下input的name属性一致
                'auto'           : false, //是否自动开始
                'multi'          : false, //是否支持多文件上传
                'buttonText'     : 'Browse', //按钮上的文字
                'simUploadLimit' : 1, //一次同步上传的文件数目
                'sizeLimit'      : 19871202, //设置单个文件大小限制
                'queueSizeLimit' : 1, //队列中同时存在的文件个数限制
                'fileDesc'       : '支持格式:jpg/gif/jpeg/png/bmp.', //如果配置了以下的'fileExt'属性,那么这个属性是必须的
                'fileExt'        : '*.jpg;*.gif;*.jpeg;*.png;*.bmp',//允许的格式  
		        onComplete: function (event, queueID, fileObj, response, data) {
					$('<li></li>').appendTo('.files').text(response);
				},
				onError: function(event, queueID, fileObj) {
					alert("文件:" + fileObj.name + "上传失败");
				},
				onCancel: function(event, queueID, fileObj){
					alert("取消了" + fileObj.name);
				}
            });
        });
        
        function uploadifyUpload(){
			$('#file').uploadifyUpload();
		}
    </script>
  </head>
  
  <body>
	<table>
		<tr>
			<td class="title">图片文件<span class="ff0000"> *</span></td>
			<td colspan="3">
				<input type="file" name="file" id="file" />
				<div id="fileQueue"></div>
				<p>
					<a href="javascript:;" onClick="javascript:uploadifyUpload()">开始上传</a>&nbsp;
					<a href="javascript:jQuery('#file').uploadifyClearQueue()">取消所有上传</a>
				</p>
				<ol class=files></ol>
			</td>
		</tr>
	</table>
  </body>
</html>
 
package com.hw.msds.base.util;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import org.apache.struts.action.ActionForm;
import org.apache.struts.action.ActionForward;
import org.apache.struts.action.ActionMapping;

import com.hw.msds.base.struts.BaseAction;

public class UploadAction extends BaseAction {
	@Override
	public ActionForward execute(ActionMapping mapping, ActionForm form,
			HttpServletRequest request, HttpServletResponse response)
			throws Exception {
		// 省略文件上传代码
		// ...
		printResponseText(response, "上传成功");//向页面端返回结果信息
		return null;
	}
}
 
分享到:
评论
4 楼 chaoren.beng 2013-09-11  
我用上之后,页面展示中文文件名时乱码,楼主有没有类似情况?
3 楼 66573334 2010-12-08  
干嘛要省略啊
2 楼 cuiran 2010-08-05  
signs228 写道
怎么获取上传的图片啊?为什么代码省略了?

留了一手.上传部分源码是用php写的,所以要对其进行修改.
1 楼 signs228 2010-04-17  
怎么获取上传的图片啊?为什么代码省略了?

相关推荐

    uploadify多文件上传例子代码

    本示例代码是关于如何使用uploadify在Java环境中(通过jsp和servlet)实现多文件上传的一个实例。 首先,uploadify是一个基于jQuery的插件,它的核心功能是通过Flash或HTML5技术提供了一种友好的用户界面,让用户...

    uploadify批量上传实例

    Uploadify是一款广泛应用于...理解并掌握Uploadify批量上传实例,将有助于提升Web应用的用户体验,尤其是在处理文件上传需求时。同时,了解其与现代上传解决方案的差异,可以帮助开发者做出更符合当前技术趋势的选择。

    .net jQuery上传插件Uploadify 文件 上传 实例,简单易懂

    在.NET开发中,文件上传是一项常见的任务,而jQuery Uploadify插件则为这一过程提供了便捷的解决方案。Uploadify是一款基于JavaScript和Flash的文件上传组件,它允许用户通过拖拽或选择文件的方式,实现多文件同时...

    uploadify多图上传实例

    【标题】:“uploadify多图上传实例” 在Web开发中,多图上传功能是一个常见的需求,尤其是在电商、社交网络和媒体分享平台等场景下。Uploadify是一款基于jQuery的文件上传插件,它允许用户批量上传文件,特别是...

    Uploadify jar包及使用实例

    至此,我们已经完成了一个基本的Uploadify文件上传实例。在实际应用中,可能还需要处理更多的细节,如错误处理、文件大小限制、文件类型检查等。Uploadify提供了一系列的选项和事件,可以根据需求进行定制。 总之,...

    Uploadify大文件(带进度条)上传实例 C# ASP.net

    Uploadify是一款著名的JavaScript插件,它允许用户在Web应用程序中实现多文件和大文件的上传功能,同时还提供了进度条显示,...这个实例不仅可以提高用户体验,还能帮助你在处理大文件上传时更好地控制和监控上传过程。

    uploadify3.2实现文件上传

    Uploadify是一款广受欢迎的jQuery插件,主要用于实现网页上的文件上传功能。它的版本3.2在当时具有较高的稳定性和良好的用户交互体验,因此备受开发者喜爱。在这个教程中,我们将深入探讨Uploadify 3.2的核心特性、...

    jQuery Uploadify文件批量上传实例

    jQuery Uploadify文件批量上传实例 自己对jQuery Uploadify插件稍作整理,样式不合适可以根据自己的需要修改; 可以实现多文件上传,同时显示上传进度条和百分比,上传完毕后将统计上传文件的总数量、文件总大小和...

    thinkphp+uploadify上传实例

    这个“thinkphp+uploadify上传实例”旨在演示如何结合两者实现高效且用户友好的文件上传功能。 首先,我们需要了解`ThinkPHP`的基础。它是一个轻量级的PHP框架,遵循敏捷开发的原则,具有良好的文档支持和丰富的...

    asp.net Uploadify 多文件上传 Jquery 多文件上传 Jquery+flash 多文件上传

    Jquery 多文件上传,jquery+flash 多文件上传,界面美观, 很炫的上传组件,支持中文! 本实例经过严格测试,保证能正常使用!网上其他好多实例都不能正常运行。 uploadify是一款容量小、功能强的Js批量上传工具,...

    HTML5 PHP jquery uploadify上传文件

    HTML5 PHP jquery uploadify上传文件,带进度条,author:吕大豹。...支持多文件上传  2.带进度条  3.可以显示文件名称  4.可以实时显示已上传的大小  5.可以从队列中删除  6.各元素的样式都可以自己控制

    PHP+UploadiFy批量上传文件

    在本文中,我们将深入探讨如何使用PHP和UploadiFy实现批量文件上传功能。UploadiFy是一款流行的JavaScript插件,它使得在Web应用程序中实现文件上传变得简单易行,而PHP作为服务器端语言,是处理这些上传请求的理想...

    spring mvc uploadify上传文件

    在本文中,我们将深入探讨如何使用Spring MVC框架与uploadify插件进行文件上传,特别是针对图片的上传。Spring MVC是Spring框架的一部分,专门用于构建Web应用程序,而uploadify是一款前端JavaScript插件,使得用户...

    uploadify异步文件上传插件

    Uploadify是一款广泛应用于Web开发中的异步文件上传插件,它极大地优化了用户在网站上上传文件的体验。异步上传技术使得文件上传无需等待整个文件传输完成即可继续执行其他操作,提高了交互效率,减轻了服务器压力。...

    jquery uploadify批量上传中文版

    在Web开发中,文件上传是一项常见的功能,而jQuery Uploadify插件因其简洁的API和强大的功能,成为众多开发者首选的批量上传解决方案。尤其是其支持中文版本,更是方便了中文用户进行操作。本文将深入解析jQuery ...

    uploadify+struts2多文件上传实例

    `uploadify`与`Struts2`结合的多文件上传实例就是一个典型的解决方案,尤其针对跨浏览器兼容性问题,如在Firefox下的session问题。下面我们将深入探讨这两个技术以及它们如何协同工作。 `Uploadify`是一个基于...

    uploadify3与struts2结合实现有进度条文件上传实例

    这是根据uploadify3 2结合struts2搭建的文件上传环境 可以直接导入eclipse运行 每步实现基本都加了注释 以下是我碰到的问题: 1 判断session是否失效 本实例没测试这个问题 但在工作项目中碰到了 但原因在这里...

    jquery上传插件uploadify+php完美实现强大的文件上传功能实例+程序

    本实例将探讨如何利用jQuery上传插件Uploadify与PHP技术来构建一个强大的文件上传系统。Uploadify是一款广泛使用的前端插件,它使得文件上传过程更加直观、用户友好,并且支持批量上传和自定义样式,极大地提升了...

Global site tag (gtag.js) - Google Analytics