文件上传显示进度条java版

、 

例子效果为：

官网下载地址：

http://www.uploadify.com

一、参考官网文档，调试出一个最简单的例子，官网文档地址为：http://www.uploadify.com/documentation/描述如下：

Before implementing an instance of Uploadify, make sure the minimum requirements are met:

∙jQuery 1.4.x or greater

∙swfObject 2.2 or greater

∙Flash Player 9.0.24 or greater

Download the latest zip package.  Extract the following files to a folder named "uploadify" in the root of your website.

∙

∙jquery.uploadify.v2.1.4.min.js

∙jquery-1.4.2.min.js

∙swfobject.js

∙uploadify.css

∙uploadify.php

∙uploadify.swf

Save a new page to the root directory of your website and paste the following code into the section:

Head Section

1.

2.

3.

4.

5.

6.$(document).ready(function() {

7.  $('#file_upload').uploadify({

8.    'uploader'  : '/uploadify/uploadify.swf',

9.    'script'    : '/uploadify/uploadify.php',

10.

11.    'folder'    : '/uploads',

12.    'auto'      : true

13.  });

14.});

15.

*Make sure the folder you are uploading to exists and has write permissions.

In the body section of the page, add the following code:

Body Section

1.

When the page is loaded, the file input will automatically be replaced with the Uploadify file uploader.

∙We highly recommend using paths that are relative to the root (AKA begin with a /).  If this isn't possible, Uploadify does play nice with links that are relative to the page.

∙Every element that Uploadify is applied to MUST have a unique ID attribute.  You can reference elements via class, but each element must have a unique ID.

For a more customized uploader, use the options below.

说明：

以上例子为全英文，调试出的例子如下：

16.

17.

18.

19.

20.

55.

56.  

57.

58. This is my JSP page.

59.

60.

61.

62.

63.

.

二、Uploadify部分参数的介绍：  

　uploader ： uploadify.swf 文件的相对路径，该swf文件是一个带有文字BROWSE的按钮，点击后弹出打开文件对话框，默认值：uploadify.swf。

　　script ： 后台处理程序的相对路径 。默认值：uploadify.php

　　checkScript ：用来判断上传选择的文件在服务器是否存在的后台处理程序的相对路径

　　fileDataName ：设置一个名字，在服务器处理程序中根据该名字来取上传文件的数据。默认为Filedata

　　method ： 提交方式Post 或Get 默认为Post

　　scriptAccess ：flash脚本文件的访问模式，如果在本地测试设置为always，默认值：sameDomain

　　folder ： 上传文件存放的目录 。

　　queueID ： 文件队列的ID，该ID与存放文件队列的div的ID一致。

　　queueSizeLimit ： 当允许多文件生成时，设置选择文件的个数，默认值：999 。

　　multi ： 设置为true时可以上传多个文件。

　　auto ： 设置为true当选择文件后就直接上传了，为false需要点击上传按钮才上传 。

　　fileDesc ： 这个属性值必须设置fileExt属性后才有效，用来设置选择文件对话框中的提示文本，如设置fileDesc为“请选择rar doc pdf文件”，打开文件选择框效果如下图：

　　fileExt ： 设置可以选择的文件的类型，格式如：'*.doc;*.pdf;*.rar' 。

　　sizeLimit ： 上传文件的大小 。

　　simUploadLimit ： 允许同时上传的个数 默认值：1 。

　　buttonText ： 浏览按钮的文本，默认值：BROWSE 。

　　buttonImg ： 浏览按钮的图片的路径 。

　　hideButton ： 设置为true则隐藏浏览按钮的图片 。

　　rollover ： 值为true和false，设置为true时当鼠标移到浏览按钮上时有反转效果。

　　width ： 设置浏览按钮的宽度 ，默认值：110。

　　height ： 设置浏览按钮的高度 ，默认值：30。

　　wmode ： 设置该项为transparent 可以使浏览按钮的flash背景文件透明，并且flash文件会被置为页面的最高层。 默认值：opaque 。

　　cancelImg ：选择文件到文件队列中后的每一个文件上的关闭按钮图标

Uploadify还自带了很多参数及有用的方法和回调函数，都在API里，虽然是全英文的，但很容易看懂，这里就不说了。

三、jquery.uploaddify 不支持中文按钮 问题

Uploadify有一个参数是 buttonText 这个无论你怎么改都不支持中文，因为插件在js里用了一个转码方法把这个参数的值转过码了，解码的地方在那个swf文件里，看不到代码，所以这条路不行。

  另一个参数，是 buttonImg( 按钮图片)，这时你完全可以用一个图片来替换掉插件自带的那个黑色的flash浏览按钮，只要你自己的图片上是中文，这不就解决了中文按钮问题么？

如果只加这一个，你会发现你的按钮图片下面有一片白色区域，其实就是那个flash留下的，白色区域表示鼠标可用范围，这个范围可以用width,height 来调整。还有一个参数 wmode 它的默认值是opaque，把它改成transparent就行了，也就是把那片白色区域透明化。