uploadify.js + servlet 实现文件上传

uploadify的官方网站：http://www.uploadify.com/

官网上有flash和html5两种版本

通用性目前当然是flash了，所以我们以flash版本为例。

我们需要加入 网页的是 

1.jquery.js

2.jquery.uploadify.js

3.uploadify.swf

4.uploadify.css

众所周知的是 html 上 ajax的方法 无法提交表单，就没法ajax的方法提交文件到服务器。

所以uploadify实现异步通信的方式是使用 flash实现的，但我们完全不需要去懂flash，只要像ajax那样调用即可。

<input type="file" name="file_upload" id="file_upload" />

$(function() {    $("#file_upload_1").uploadify({        height        : 30,        swf           : '/uploadify/uploadify.swf',        uploader      : '/uploadify/uploadify.php',        width         : 120    });});

api如下

Options

• auto
• buttonClass
• buttonCursor
• buttonImage
• buttonText
• checkExisting
• debug
• fileObjName
• fileSizeLimit
• fileTypeDesc
• fileTypeExts
• formData
• height
• itemTemplate
• method
• multi
• overrideEvents
• preventCaching
• progressData
• queueID
• queueSizeLimit
• removeCompleted
• removeTimeout
• requeueErrors
• successTimeout
• swf
• uploader
• uploadLimit
• width

Events

• onCancel
• onClearQueue
• onDestroy
• onDialogClose
• onDialogOpen
• onDisable
• onEnable
• onFallback
• onInit
• onQueueComplete
• onSelect
• onSelectError
• onSWFReady
• onUploadComplete
• onUploadError
• onUploadProgress
• onUploadStart
• onUploadSuccess

Methods

• cancel
• destroy
• disable
• settings
• stop
• upload

重点说一下事件 onUploadComplete 是当上传完成时，它只管文件是否上传，至于服务器怎么处理与他无关

而事件 onUploadSuccess 是需要服务器回应的

$(function() {    $("#file_upload").uploadify({        'swf'             : '/uploadify/uploadify.swf',        'uploader'        : '/uploadify/uploadify.php',        'onUploadSuccess' : function(file, data, response) {            alert('The file ' + file.name + ' was successfully uploaded with a response of ' + response + ':' + data);        }    });});

所以  onUploadSuccess 有三个参数 而onUploadComplete 只有一个 file：

file是上传的文件 

data是服务器返回的数据 也就是 print的数据。

response 也是服务器回应不过不是数据而是是否有回应，  如果有返回值 ， response=true 否则 response=false

服务器端servlet 或者 action 的 写法 与 普通接收表单文件提交的 一样一样的 ,这里就不赘述了。