软件安装与使用（25）
原文链接：/2050/archive//2662932.html
SWFUpload是一个flash和js相结合而成的文件上传插件，其功能非常强大。以前在项目中用过几次，但它的配置参数太多了，用过后就忘记怎么用了，到以后要用时又得到官网上看它的文档，真是太烦了。所以索性就把它的用法记录下来，也方便英语拙计的同学查看，利人利己，一劳永逸。
SWFUpload的特点：
1、用flash进行上传，页面无刷新，且可自定义Flash按钮的样式;
2、可以在浏览器端就对要上传的文件进行限制;
3、允许一次上传多个文件，但会有一个上传队列，队列里文件的上传是逐个进行的，服务器端接收文件时跟普通的表单上传文件是一样的;
4、提供了丰富的事件接口供开发者使用;
SWFUpload的文件上传流程是这样的：
1、引入相应的js文件
2、实例化SWFUpload对象，传入一个配置参数对象进行各方面的配置。
3、点击SWFUpload提供的Flash按钮，弹出文件选取窗口选择要上传的文件；
4、文件选取完成后符合规定的文件会被添加到上传的队列里；
5、调用startUpload方法让队列里文件开始上传；
6、文件上传过程中会触发相应的事件，开发者利用这些事件来更新ui、处理错误、发出提示等等；
SWFUpload包括三部分的内容：SWFUpload.js、swfupload.swf、初始化配置参数及各种事件处理函数。所以首先在页面引入SWFUpload.js
&script src='SWFUpload.js'&&/script&
然后实例化一个SWFUpload对象：
window.onload = function () {
var settings_object = {//定义参数配置对象
upload_url : &http://www.swfupload.org/upload.php&,
flash_url : &http://www.swfupload.org/swfupload.swf&,
file_post_name : &Filedata&,
post_params : {
&post_param_name_1& : &post_param_value_1&,
&post_param_name_2& : &post_param_value_2&,
&post_param_name_n& : &post_param_value_n&
use_query_string : false,
requeue_on_error : false,
http_success : [201, 202],
assume_success_timeout : 0,
file_types : &*.*.gif&,
file_types_description: &Web Image Files&,
file_size_limit : &1024&,
file_upload_limit : 10,
file_queue_limit : 2,
debug : false,
prevent_swf_caching : false,
preserve_relative_urls : false,
button_placeholder_id : &element_id&,
button_image_url : &http://www.swfupload.org/button_sprite.png&,
button_width : 61,
button_height : 22,
button_text : &&b&Click&/b& &span class=&redText&&here&/span&&,
button_text_style : &.redText { color: #FF0000; }&,
button_text_left_padding : 3,
button_text_top_padding : 2,
button_action : SWFUpload.BUTTON_ACTION.SELECT_FILES,
button_disabled : false,
button_cursor : SWFUpload.CURSOR.HAND,
button_window_mode : SWFUpload.WINDOW_MODE.TRANSPARENT,
swfupload_loaded_handler : swfupload_loaded_function,
file_dialog_start_handler : file_dialog_start_function,
file_queued_handler : file_queued_function,
file_queue_error_handler : file_queue_error_function,
file_dialog_complete_handler : file_dialog_complete_function,
upload_start_handler : upload_start_function,
upload_progress_handler : upload_progress_function,
upload_error_handler : upload_error_function,
upload_success_handler : upload_success_function,
upload_complete_handler : upload_complete_function,
debug_handler : debug_function,
swfu = new SWFUpload(settings_object);//实例化一个SWFUpload，传入参数配置对象
/*定义各种事件监听函数*/
function swfupload_loaded_function(){}
function file_dialog_start_function(){}
我们看到要实现一个swfupload上传功能很简单，就是实例化一个swfupload对象。但繁琐的地方就在于实例化实要用到的参数配置对象，以及各种事件的发生时机以和提供的参数。所以重点来了。下面几个表格对开发中要用到的东西列举了出来，虽然已经蛮多了，但并不是swfupload的全部，我列出来的只是常用的。要查看完整的文档，请到官网上查询。
一、配置参数对象中的常用属性及说明
默认值
upload_url
处理上传文件的服务器端页面的url地址，可以是绝对地址，也可以是相对地址，当为相对地址时相对的是当前代码所在的文档地址
preserve_relative_urls
如果为false则SWFUpload会把swfupload.swf用到的相对地址转换为绝对地址，以达到更好的兼容性
file_post_name
相当于用普通的文件域上传文件时的name属性，服务器端接收页面通过该名称来获取上传的文件
post_params
Object(直接量)
一个对象直接量，里面的键/值对会随着每一个文件一起上传，文件上传要附加一些信息时很有用
use_query_string
为false时,post_params属性定义的参数会以post方式上传；为true时，则会以get方式上传（即参数会以查询字符串的形式附加到url后面）
file_types
该属性指定了允许上传的文件类型，当有多个类型时使用分号隔开，比如：*.*.png ,允许所有类型时请使用 *.*
file_types_description
指定在文件选取窗口中显示的文件类型描述，起一个提示和说明的作用吧
file_size_limit
指定要上传的文件的最大体积，可以带单位，合法的单位有:B、KB、MB、GB，如果省略了单位，则默认为KB。该属性为0时，表示不限制文件的大小。
file_upload_limit
指定最多能上传多少个文件，当上传成功的文件数量达到了这个最大值后，就不能再上传文件了，也不能往上传队列里添加文件了。把该属性设为0时表示不限制文件的上传数量。
file_queue_limit
指定文件上传队列里最多能同时存放多少个文件。当超过了这个数目后只有当队列里有文件上传成功、上传出错或被取消上传后，等同数量的其他文件才可以被添加进来。当file_upload_limit的数值或者剩余的能上传的文件数量小于file_queue_limit时，则取那个更小的值
swfupload.swf文件的绝对或相对地址，相对地址是指相对于当前的页面地址。实例化swfupload后，就不能再改变该属性的值了。
prevent_swf_caching
为true时会加一个随机数在swfupload.swf地址的后面，以阻止flash影片被缓存，这是为了防止某些版本的IE浏览器在读取缓存的falsh影片时出现的bug
button_placeholder_id
指定一个dom元素的id,该dom元素在swfupload实例化后会被Flash按钮代替，这个dom元素相当于一个占位符
button_placeholder
DOMElement
指定一个dom元素,该dom元素在swfupload实例化后会被Flash按钮代替，这个dom元素相当于一个占位符。当button_placeholder_id与button_placeholder都存在时，以button_placeholder_id为优先
button_image_url
指定Flash按钮的背景图片，相对地址或绝对地址都可以。该地址会受到preserve_relative_urls属性的影响，遵从与upload_url一样的规则。
该背景图片必须是一个sprite图片,从上到下包含了Flash按钮的正常、鼠标悬停、按下、禁用这四种状态。因此该图片的高度应该是Flash按钮高度的四倍
button_width
指定Flash按钮的宽度
button_height
指定Flash按钮的高度，应该为button_image_url所指定的按钮背景图片高度的1/4
button_text
指定Flash按钮上的文字，也可以是html代码
button_text_style
Flash按钮上的文字的样式，使用方法见示例
button_text_top_padding
指定Flash按钮顶部的内边距，可使用负值
button_text_left_padding
指定Flash按钮左边的内边距，可使用负值
button_disabled
为true时Flash按钮将变为禁用状态，点击也不会触发任何行为
button_cursor
指定鼠标悬停在Flash按钮上时的光标样式，可用值为SWFUpload.CURSOR里定义的常量
button_window_mode
指定Flash按钮的WMODE属性，可用值为SWFUpload.WINDOW_MODE里定义的常量
file_dialog_start_handler
fileDialogStart事件侦听函数
file_queued_handler
fileQueued事件侦听函数
file_queue_error_handler
fileQueueError事件侦听函数
file_dialog_complete_handler
fileDialogComplete事件侦听函数
upload_start_handler
uploadStart事件侦听函数
upload_progress_handler
uploadProgress事件侦听函数
upload_error_handler
uploadError事件侦听函数
upload_success_handler
uploadSuccess事件侦听函数
upload_complete_handler
uploadComplete事件侦听函数
二、各种事件说明
要实现与用户的交互，靠的就是在这些事件上做文章了
fileDialogStart ( )
在文件选取窗口将要弹出时触发
fileQueued ( file object )
当一个文件被添加到上传队列时会触发此事件，提供的唯一参数为包含该文件信息的file object对象
fileQueueError ( file object, error code, message )
当文件添加到上传队列失败时触发此事件，失败的原因可能是文件大小超过了你允许的数值、文件是空的或者文件队列已经满员了等。
该事件提供了三个参数。第一个参数是当前出现问题的文件对象，第二个参数是具体的错误代码，可以参照SWFUpload.QUEUE_ERROR中定义的常量
fileDialogComplete ( number of files selected, number of files queued, total number of files in the queued )
当文件选取完毕且选取的文件经过处理后（指添加到上传队列），会立即触发该事件。可以在该事件中调用this.startUpload()方法来实现文件的自动上传
参数number of files selected指本次在文件选取框里选取的文件数量
参数number of files queued指本次被添加到上传队列的文件数量
参数total number of files in the queued指当前上传队列里共有多少个文件（包括了本次添加进去的文件）
uploadStart ( file object )
当文件即将上传时会触发该事件,该事件给了你在文件上传前的最后一次机会来验证文件信息、增加要随之上传的附加信息或做其他工作。可以通过返回false来取消本次文件的上传
参数file object为当前要上传的文件的信息对象
uploadProgress ( file object, bytes complete, total bytes )
该事件会在文件的上传过程中反复触发，可以利用该事件来实现上传进度条
参数file object为文件信息对象
参数bytes complete为当前已上传的字节数
参数total bytes为文件总的字节数
uploadError ( file object, error code, message )
文件上传被中断或是文件没有成功上传时会触发该事件。停止、取消文件上传或是在uploadStart事件中返回false都会引发这个事件，但是如果某个文件被取消了但仍然还在队列中则不会触发该事件
参数file object为文件信息对象
参数error code为错误代码，具体的可参照SWFUpload.UPLOAD_ERROR中定义的常量
uploadSuccess ( file object, server data, received response )
当一个文件上传成功后会触发该事件
参数file object为文件信息对象
参数server data为服务器端输出的数据
uploadComplete( file object )
当一次文件上传的流程完成时（不管是成功的还是不成功的）会触发该事件，该事件表明本次上传已经完成，上传队列里的下一个文件可以开始上传了。该事件发生后队列中下一个文件的上传将会开始
三、swfupload实例的方法
方法中大多数是动态改变参数配置对象的方法
destroy ( )
当不需要再使用SWFUpload了的时候,可以使用该方法来销毁它的实例和dom元素
startUpload( file_id )
开始上传队列中指定的文件
参数file_id代表要上传的文件的id，如果未填写这个参数，则会上传队列中第一个文件
cancelUpload ( file_id, trigger_error_event )
取消文件的上传
参数file_id为要取消的文件的id,如果该参数为undefined或者未填写，则会取消队列里的第一个文件
参数trigger_error_event接受一个布尔值，当为false时取消文件不会触发uploadError事件，默认为true
stopUpload ( )
终止当前正在上传的文件，会触发uploadError事件。如果当前没有文件在上传，则该方法什么都不会做
getStats ( )
获取队列的stats object
setStats ( stats_object )
修改队列的stats_object，传入修改过的stats_object作为参数
getFile ( file_id|index )
根据文件id或文件索引来获取一个File Object,当使用文件id时只能获得队列里的文件，当使用文件索引时所有文件（包括队列内和队列外）都可获得
addPostParam ( name, value)
往配置对象中post_params指定的附加信息对象中增加键/值对
removePostParam ( name)
移除置配置对象中的post_params包含的某一个键/值对，参数name为要移除的值的键名
addFileParam ( file_id, name, value)
为某个特定文件增加随之一起上传的附加信息。注意，只有在该指定的文件上传时，附加的信息才会一起上传。而配置对象中post_param设置的附加信息在任一文件上传时都会与之一起发送。
参数file_id为要指定的文件id,参数name和value分别为附加信息的名称和值
removeFileParam ( file_id, name)
移除通过addFileParam方法增加的附加信息，两个参数相信就不用我多讲了吧
setUploadURL ( url)
动态设置配置对象中upload_url的值
setPostParams ( param_object)
动态设置配置对象中post_params属性的值，新的值会覆盖旧的值。
参数param_object必须为一个对象直接量，且里面的属性和值都只能为字符串
setFileTypes ( types, description)
动态设置配置对象中file_types 和 file_types_description属性的值。两个参数都不能省略
setFileSizeLimit ( file_size_limit)
动态设置配置对象中file_size_limit属性的值
setFileUploadLimit ( file_upload_limit)
动态设置配置对象中file_upload_limit属性的值
setFileQueueLimit ( file_queue_limit)
动态设置配置对象中file_queue_limit属性的值
setFilePostName ( file_post_name)
动态设置配置对象中file_post_name属性的值
setUseQueryString ( use_query_string)
动态设置配置对象中use_query_string属性的值
setButtonImageURL ( url)
动态设置配置对象中button_image_url属性的值
setButtonDimensions ( width, height)
动态设置Flash按钮的宽度和高度，两个参数分别为宽度和高度的值，类型为数字，且不能带单位
setButtonText ( text)
动态设置配置对象中button_text属性的值
setButtonTextStyle ( css_style_text)
动态设置配置对象中button_text_style属性的值
setButtonTextPadding ( left, top )
动态设置Flash按钮的左边内边距和顶部内边距
setButtonDisabled ( isDisabled )
动态对Flash按钮进行禁用和不禁用的操作，参数为一个布尔值
setButtonCursor ( buttonCursor )
动态设置配置对象中button_cursor的值
四、文件信息对象 File Object
在事件监听函数中，经常要用到文件信息对象来获取文件的信息以供下一步的操作
SWFUpload定义的文件id,用来控制文件的上传
文件的索引，用在getFile(i)方法中
文件的原始名称，不包括路径
creationdate
文件的创建日期
modificationdate
文件的最后修改日期
filestatus
当前文件的状态，详细的请参照SWFUpload.FILE_STATUS中定义的常量
五、队列状态对象 Stats Object
用来获取当前队列的状况
in_progress
得到的值为1或0，表明当前队列是否有文件正在上传中
files_queued
目前上传队列中的文件数量
successful_uploads
已成功上传(指触发了uploadSuccess事件)的文件数量
upload_errors
上传失败的文件数量(包括被取消上传的文件)
upload_cancelled
被取消上传的文件数量
queue_errors
触发了fileQueueError事件的文件数量
六、一些常量
定义的一些常量，便于理解
SWFUpload.instances
该常量是一个对象，代表一个页面上所有的SWFUpload实例的引用的集合，用SWFUpload实例的movieName属性进行索引
SWFUpload.movieCount
页面上存在的SWFUpload实例的数量
SWFUpload.QUEUE_ERROR.QUEUE_LIMIT_EXCEEDED
用户选取的文件超过了允许的数量
SWFUpload.QUEUE_ERROR.FILE_EXCEEDS_SIZE_LIMIT
文件的体积超过了允许的大小
SWFUpload.QUEUE_ERROR.ZERO_BYTE_FILE
文件是空的
SWFUpload.QUEUE_ERROR.INVALID_FILETYPE
不允许的文件类型
SWFUpload.UPLOAD_ERROR.HTTP_ERROR
服务器返回的状态码不是200
SWFUpload.UPLOAD_ERROR.MISSING_UPLOAD_URL
没有设置 upload_url
SWFUpload.UPLOAD_ERROR.IO_ERROR
读取或传输文件时发生错误
SWFUpload.UPLOAD_ERROR.SECURITY_ERROR
上传受到了安全方面的限制
SWFUpload.UPLOAD_ERROR.UPLOAD_LIMIT_EXCEEDED
上传的文件数量超过了允许的最大值
SWFUpload.UPLOAD_ERROR.UPLOAD_FAILED
上传出现错误
SWFUpload.UPLOAD_ERROR.SPECIFIED_FILE_ID_NOT_FOUND
给startUpload()方法传入的文件id不存在
SWFUpload.UPLOAD_ERROR.FILE_VALIDATION_FAILED
uploadStart()方法中返回了false
SWFUpload.UPLOAD_ERROR.FILE_CANCELLED
上传被取消了
SWFUpload.UPLOAD_ERROR.UPLOAD_STOPPED
上传被终止了
SWFUpload.FILE_STATUS.QUEUED
文件正在队列中等待上传
SWFUpload.FILE_STATUS.IN_PROGRESS
文件正在上传
SWFUpload.FILE_STATUS.ERROR
文件在添加到队列或是上传的时候出现了错误
SWFUpload.PLETE
文件已上传成功
SWFUpload.FILE_STATUS.
文件被取消上传
SWFUpload.CURSOR.ARROW
鼠标以箭头显示
SWFUpload.CURSOR.HAND
鼠标以手形显示
SWFUpload.WINDOW_MODE.WINDOW
Flash按钮会显示在页面的所有dom元素上面
SWFUpload.WINDOW_MODE.OPAQUE
允许其他dom元素覆盖住Flash按钮
SWFUpload.WINDOW_MODE.TRANSPARENT
允许Flash按钮透明显示
内容太多了，感觉有点乱了，如果还不清楚怎么使用，建议看下官网的使用流程，明白怎么使用后再来看这些属性、事件、方法、常量什么的吧
&&相关文章推荐
* 以上用户言论只代表其个人观点，不代表CSDN网站的观点或立场
访问：24215次
排名：千里之外
转载：74篇
译文：12篇
(9)(5)(13)(60)(1)(1)(1)(3)(1)
(window.slotbydup = window.slotbydup || []).push({
id: '4740887',
container: s,
size: '250,250',
display: 'inlay-fix'swfupload详解_百度文库
两大类热门资源免费畅读
续费一年阅读会员，立省24元！
swfupload详解
阅读已结束，下载文档到电脑
想免费下载本文？
定制HR最喜欢的简历
下载文档到电脑，方便使用
还剩9页未读，继续阅读
定制HR最喜欢的简历
你可能喜欢前端上传组件Plupload使用指南 - plupload- - ITkeyowrd
前端上传组件Plupload使用指南
推荐：Plupload 是一款由著名的web编辑器 TinyMCE 团队开发的上传组件，简单易用且功能强大，我们完全可以使用Plupload来代替以前的SWFUpload。 Plupload有以下功能和
转载自：/2050/p/3913184.html
我之前写过一篇文章《》，里面介绍了上传组件SWFUpload的使用方法，但现在随着html5技术的逐渐推广和普及，再去使用以flash为上传手段的SWFUpload显然就有点过时了，毕竟html5原生的就给我们提供了文件上传的API。是一款由著名的web编辑器团队开发的上传组件，简单易用且功能强大，我们完全可以使用Plupload来代替以前的SWFUpload。
Plupload有以下功能和特点：
1、拥有多种上传方式：HTML5、flash、silverlight以及传统的&input type=”file” /&。Plupload会自动侦测当前的环境，选择最合适的上传方式，并且会优先使用HTML5的方式。所以你完全不用去操心当前的浏览器支持哪些上传方式，Plupload会自动为你选择最合适的方式。
2、支持以拖拽的方式来选取要上传的文件
3、支持在前端压缩图片，即在图片文件还未上传之前就对它进行压缩
4、可以直接读取原生的文件数据，这样的好处就是例如可以在图片文件还未上传之前就能把它显示在页面上预览
5、支持把大文件切割成小片进行上传，因为有些浏览器对很大的文件比如几G的一些文件无法上传。
Plupload的使用方法也与SWFUpload非常类似，可以分为以下几步：
1、引入js文件，plupload的源文件可以到上去下载
2、实例化一个plupload对象，传入一个配置参数对象进行各方面的配置。
3、调用plupload实例对象的init()方法进行初始化
4、在plupload实例对象上注册各种你需要的事件。plupload从选取文件到文件上传完成这个过程中，会触发很多事件。我们可以通过这些事件来跟plupload进行交互。
5、实现你自己所注册的那些事件的监听函数，利用这些监听函数来进行更新UI、提示上传进度等工作。
大家可以到看一下我写的关于plupload的几个上传demo。
下面用一段代码来说明Plupload的使用方法。
首先看下我的目录结构
index.html的代码如下：
&!DOCTYPE html&
&meta charset=&UTF-8&&
&title&Plupload使用指南&/title&
&!-- 首先需要引入plupload的源代码 --&
&script src=&js/plupload.full.min.js&&&/script&
&!-- 这里我们只使用最基本的html结构：一个选择文件的按钮，一个开始上传文件的按钮(甚至该按钮也可以不要) --&
&button id=&browse&&选择文件&/button&
&button id=&start_upload&&开始上传&/button&
//实例化一个plupload上传对象
var uploader = new plupload.Uploader({
browse_button : 'browse', //触发文件选择对话框的按钮，为那个元素id
url : 'upload.php', //服务器端的上传页面地址
flash_swf_url : 'js/Moxie.swf', //swf文件，当需要使用swf方式进行上传时需要配置该参数
silverlight_xap_url : 'js/Moxie.xap' //silverlight文件，当需要使用silverlight方式进行上传时需要配置该参数
//在实例对象上调用init()方法进行初始化
uploader.init();
//绑定各种事件，并在事件监听函数中做你想做的事
uploader.bind('FilesAdded',function(uploader,files){
//每个事件监听函数都会传入一些很有用的参数，
//我们可以利用这些参数提供的信息来做比如更新UI，提示上传进度等操作
uploader.bind('UploadProgress',function(uploader,file){
//每个事件监听函数都会传入一些很有用的参数，
//我们可以利用这些参数提供的信息来做比如更新UI，提示上传进度等操作
//最后给&开始上传&按钮注册事件
document.getElementById('start_upload').onclick = function(){
uploader.start(); //调用实例对象的start()方法开始上传文件，当然你也可以在其他地方调用该方法
使用Plupload的关键是了解它众多的配置参数、事件以及属性和方法。我把它官网上的文档翻译成了中文并整理如下。我也把它放到了github上，你可以到去查阅。
一、配置参数
实例化一个plupload对象时，也就是&new plupload.Uploader()，需要传入一个对象作为配置参数。后面内容中出现的plupload实例均是指new plupload.Uploader()得到的实例对象 属性 类型 默认值 描述 browse_button String / DOM & 触发文件选择对话框的DOM元素，当点击该元素后便后弹出文件选择对话框。该值可以是DOM元素对象本身，也可以是该DOM元素的id url String & 服务器端接收和处理上传文件的脚本地址，可以是相对路径(相对于当前调用Plupload的文档)，也可以是绝对路径 filters Object { } 可以使用该参数来限制上传文件的类型，大小等，该参数以对象的形式传入，它包括三个属性：
mime_types：用来限定上传文件的类型，为一个数组，该数组的每个元素又是一个对象，该对象有title和extensions两个属性，title为该过滤器的名称，extensions为文件扩展名，有多个时用逗号隔开。该属性默认为一个空数组，即不做限制。
max_file_size：用来限定上传文件的大小，如果文件体积超过了该值，则不能被选取。值可以为一个数字，单位为b,也可以是一个字符串，由数字和单位组成，如'200kb'
prevent_duplicates：是否允许选取重复的文件，为true时表示不允许，为false时表示允许，默认为false。如果两个文件的文件名和大小都相同，则会被认为是重复的文件
filters完整的配置示例如下(当然也可以只配置其中的某一项)：
filters: {
mime_types : [ //只允许上传图片和zip文件
{ title : &Image files&, extensions : &jpg,gif,png& },
{ title : &Zip files&, extensions : &zip& }
max_file_size : '400kb', //最大只能上传400kb的文件
prevent_duplicates : true //不允许选取重复文件
} headers Object & 设置上传时的自定义头信息，以键/值对的形式传入，键代表头信息属性名，键代表属性值。html4上传方式不支持设置该属性。 multipart Boolean true 为
true时将以
multipart/form-data的形式来上传文件，为false时则以二进制的格式来上传文件。html4上传方式不支持以二进制格式来上传文件，在flash上传方式中，二进制上传也有点问题。并且二进制格式上传还需要在服务器端做特殊的处理。一般我们用multipart/form-data的形式来上传文件就足够了。 multipart_params Object & 上传时的附加参数，以键/值对的形式传入，服务器端可是使用$_POST来获取这些参数(以php为例)。比如：
multipart_params: {
three: { //值还可以是一个字面量对象
four: ['6', '7', '8']
//也可以是一个数组
} max_retries Number 0 当发生
plupload.HTTP_ERROR错误时的重试次数，为0时表示不重试 chunk_size Number/String 0 分片上传文件时，每片文件被切割成的大小，为数字时单位为字节。也可以使用一个带单位的字符串，如
&200kb&。当该值为0时表示不使用分片上传功能 resize Object & 可以使用该参数对将要上传的图片进行压缩，该参数是一个对象，里面包括5个属性：
width：指定压缩后图片的宽度，如果没有设置该属性则默认为原始图片的宽度
height：指定压缩后图片的高度，如果没有设置该属性则默认为原始图片的高度
crop：是否裁剪图片
quality：压缩后图片的质量，只对jpg格式的图片有效，默认为90。quality可以跟width和height一起使用，但也可以单独使用，单独使用时，压缩后图片的宽高不会变化，但由于质量降低了，所以体积也会变小
preserve_headers：压缩后是否保留图片的元数据，true为保留，false为不保留,默认为true。删除图片的元数据能使图片的体积减小一点点
resize参数的配置示例如下：
width: 100,
height: 100,
crop: true,
quality: 60,
preserve_headers: false
} drop_element DOM/String/Array & 指定了使用拖拽方式来选择上传文件时的拖拽区域，即可以把文件拖拽到这个区域的方式来选择文件。该参数的值可以为一个DOM元素的id,也可是DOM元素本身，还可以是一个包括多个DOM元素的数组。如果不设置该参数则拖拽上传功能不可用。目前只有html5上传方式才支持拖拽上传。 multi_selection Boolean true 是否可以在文件浏览对话框中选择多个文件，true为可以，false为不可以。默认true，即可以选择多个文件。需要注意的是，在某些不支持多选文件的环境中，默认值是false。比如在ios7的safari浏览器中，由于存在bug，造成不能多选文件。当然，在html4上传方式中，也是无法多选文件的。 required_features Mix & 可以使用该参数来设置你必须需要的一些功能特征，Plupload会根据你的设置来选择合适的上传方式。因为，不同的上传方式，支持的功能是不同的，比如拖拽上传只有html5上传方式支持，图片压缩则只有html5,flash,silverlight上传方式支持。该参数的值是一个混合类型，可以是一个以逗号分隔的字符串， unique_names Boolean false 当值为true时会为每个上传的文件生成一个唯一的文件名，并作为额外的参数post到服务器端，参数明为
name,值为生成的文件名。 runtimes String html5,flash,
silverlight,
html4 用来指定上传方式，指定多个上传方式请使用逗号隔开。一般情况下，你不需要配置该参数，因为Plupload默认会根据你的其他的参数配置来选择最合适的上传方式。如果没有特殊要求的话，Plupload会首先选择html5上传方式，如果浏览器不支持html5，则会使用flash或silverlight，如果前面两者也都不支持，则会使用最传统的html4上传方式。如果你想指定使用某个上传方式，或改变上传方式的优先顺序，则你可以配置该参数。 file_data_name String file 指定文件上传时文件域的名称，默认为
file,例如在php中你可以使用
$_FILES['file']来获取上传的文件信息 container DOM/String & 用来指定Plupload所创建的html结构的父容器，默认为前面指定的
browse_button的父元素。该参数的值可以是一个元素的id,也可以是DOM元素本身。 flash_swf_url String js/Moxie.swf flash上传组件的url地址，如果是相对路径，则相对的是调用Plupload的html文档。当使用flash上传方式会用到该参数。 silverlight_xap_url String js/Moxie.xap silverlight上传组件的url地址，如果是相对路径，则相对的是调用Plupload的html文档。当使用silverlight上传方式会用到该参数。
二、各种事件说明
要了解plupload的运行状况，靠的就是在这些事件了 Init 当Plupload初始化完成后触发
监听函数参数：(uploader)
uploader为当前的plupload实例对象 PostInit 当Init事件发生后触发
监听函数参数：(uploader)
uploader为当前的plupload实例对象 OptionChanged 当使用Plupload实例的setOption()方法改变当前配置参数后触发
监听函数参数：(uploader,option_name,new_value,old_value)
uploader为当前的plupload实例对象，option_name为发生改变的参数名称，new_value为改变后的值，old_value为改变前的值 Refresh 当调用plupload实例的refresh()方法后会触发该事件，暂时不清楚还有什么其他动作会触发该事件，但据我测试，把文件添加到上传队列后也会触发该事件。
监听函数参数：(uploader)
uploader为当前的plupload实例对象 StateChanged 当上传队列的状态发生改变时触发
监听函数参数：(uploader)
uploader为当前的plupload实例对象 UploadFile 当上传队列中某一个文件开始上传后触发
监听函数参数：(uploader,file)
uploader为当前的plupload实例对象，file为触发此事件的文件对象 BeforeUpload 当队列中的某一个文件正要开始上传前触发
监听函数参数：(uploader,file)
uploader为当前的plupload实例对象，file为触发此事件的文件对象 QueueChanged 当上传队列发生变化后触发，即上传队列新增了文件或移除了文件。QueueChanged事件会比FilesAdded或FilesRemoved事件先触发
监听函数参数：(uploader)
uploader为当前的plupload实例对象 UploadProgress 会在文件上传过程中不断触发，可以用此事件来显示上传进度
监听函数参数：(uploader,file)
uploader为当前的plupload实例对象，file为触发此事件的文件对象 FilesRemoved 当文件从上传队列移除后触发
监听函数参数：(uploader,files)
uploader为当前的plupload实例对象，files为一个数组，里面的元素为本次事件所移除的文件对象 FileFiltered 暂不清楚该事件的意义，但根据测试得出，该事件会在每一个文件被添加到上传队列前触发
监听函数参数：(uploader,file)
uploader为当前的plupload实例对象，file为触发此事件的文件对象 FilesAdded 当文件添加到上传队列后触发
监听函数参数：(uploader,files)
uploader为当前的plupload实例对象，files为一个数组，里面的元素为本次添加到上传队列里的文件对象 FileUploaded 当队列中的某一个文件上传完成后触发
监听函数参数：(uploader,file,responseObject)
uploader为当前的plupload实例对象，file为触发此事件的文件对象，responseObject为服务器返回的信息对象，它有以下3个属性：
response：服务器返回的文本
responseHeaders：服务器返回的头信息
status：服务器返回的http状态码，比如200 ChunkUploaded 当使用文件小片上传功能时，每一个小片上传完成后触发
监听函数参数：(uploader,file,responseObject)
uploader为当前的plupload实例对象，file为触发此事件的文件对象，responseObject为服务器返回的信息对象，它有以下5个属性：
offset：该文件小片在整体文件中的偏移量
response：服务器返回的文本
responseHeaders：服务器返回的头信息
status：服务器返回的http状态码，比如200
total：该文件(指的是被切割成了许多文件小片的那个文件)的总大小，单位为字节 UploadComplete 当上传队列中所有文件都上传完成后触发
监听函数参数：(uploader,files)
uploader为当前的plupload实例对象，files为一个数组，里面的元素为本次已完成上传的所有文件对象 Error 当发生错误时触发
监听函数参数：(uploader,errObject)
uploader为当前的plupload实例对象，errObject为错误对象，它至少包含以下3个属性(因为不同类型的错误，属性可能会不同)：
code：错误代码，具体请参考plupload上定义的表示错误代码的常量属性
file：与该错误相关的文件对象
message：错误信息 Destroy 当调用destroy方法时触发
监听函数参数：(uploader)
uploader为当前的plupload实例对象
三、Plupload实例的属性 属性 描述 id Plupload实例的唯一标识id state 当前的上传状态，可能的值为
plupload.STARTED或
plupload.STOPPED，该值由Plupload实例的
statr()方法控制。默认为
plupload.STOPPED runtime 当前使用的上传方式 files 当前的上传队列，是一个由上传队列中的文件对象组成的数组 settings 当前的配置参数对象 total 表示总体进度信息的QueueProgress对象
四、Plupload实例的方法 方法 描述 init() 初始化Plupload实例 setOption(option, [value]) 设置某个特定的配置参数,option为参数名称，value为要设置的参数值。option也可以为一个由参数名和参数值键/值对组成的对象，这样就可以一次设定多个参数，此时该方法的第二个参数value会被忽略。 getOption([option]) 获取当前的配置参数，参数option为需要获取的配置参数名称，如果没有指定option，则会获取所有的配置参数 refresh() 刷新当前的plupload实例，暂时还不明白什么时候需要使用 start() 开始上传队列中的文件 stop() 停止队列中的文件上传 disableBrowse(disable) 禁用或启用plupload的文件浏览按钮,参数
true时为禁用，为
false时为启用。默认为
true getFile(id) 通过id来获取文件对象 addFile(file, [fileName]) 向上传队列中添加文件，如果成功添加了文件，会触发
FilesAdded事件。参数file为要添加的文件,可以是一个原生的文件,或者一个plupload文件对象,或者一个
input[type=&file&]元素,还可以是一个包括前面那几种东西的数组；fileName为给该文件指定的名称 removeFile(file) 从上传队列中移除文件，参数
file为plupload文件对象或先前指定的文件名称 splice(start, length) 从上传队列中移除一部分文件，
start为开始移除文件在队列中的索引，
length为要移除的文件的数量，该方法的返回值为被移除的文件。该方法会触发
FilesRemoved&和
QueueChanged事件 trigger(name, Multiple) 触发某个事件。
name为要触发的事件名称，
Multiple为传给该事件监听函数的参数，是一个对象 hasEventListener(name) 用来判断某个事件是否有监听函数，
name为事件名称 bind(name, func, scope) 给某个事件绑定监听函数，
name为事件名，
func为监听函数，
scope为监听函数的作用域，也就是监听函数中this的指向 unbind(name, func) 移除事件的监听函数，
name为事件名称，
func为要移除的监听函数 unbindAll() 移除所有事件的所有监听函数 destroy() 销毁plupload实例
五、文件对象的属性和方法
在很多事件监听函数中，都会提供文件对象给你 属性/方法 描述 id 文件id name 文件名，例如&myfile.gif& type 文件类型，例如&image/jpeg& size 文件大小，单位为字节，当启用了客户端压缩功能后，该值可能会改变 origSize 文件的原始大小，单位为字节 loaded 文件已上传部分的大小，单位为字节 percent 文件已上传部分所占的百分比，如50就代表已上传了50% status 文件的状态，可能为以下几个值之一：
plupload.QUEUED,&
plupload.UPLOADING,&
plupload.FAILED,&
plupload.DONE lastModifiedDate 文件最后修改的时间 getNative() 获取原生的文件对象 getSource() 获取mOxie.File 对象，想了解mOxie是什么东西，可以看下/moxiecode/moxie/wiki/API destroy() 销毁文件对象
六、QueueProgress 对象的属性
plupload实例的total属性是一个QueueProgress对象 属性 描述 size 上传队列中所有文件加起来的总大小，单位为字节 loaded 队列中当前已上传文件加起来的总大小,单位为字节 uploaded 已完成上传的文件的数量 failed 上传失败的文件数量 queued 队列中剩下的(也就是除开已经完成上传的文件)需要上传的文件数量 percent 整个队列的已上传百分比，如50就代表50% bytesPerSec 上传速率，单位为 byte/s，也就是 字节/秒
七、plupload命名空间上的一些属性
plupload的命名空间上有一些属性，用来表示一些常量。记住，不是plupload实例的属性，而是plupload的属性 属性名称 描述 VERSION 当前plupload的版本号 STOPPED 值为1，代表上传队列还未开始上传或者上传队列中的文件已经上传完毕时plupload实例的
state属性值 STARTED 值为2，代表队列中的文件正在上传时plupload实例的
state属性值 QUEUED 值为1，代表某个文件已经被添加进队列等待上传时该文件对象的
status属性值 UPLOADING 值为2，代表某个文件正在上传时该文件对象的
status属性值 FAILED 值为4，代表某个文件上传失败后该文件对象的
status属性值 DONE 值为5，代表某个文件上传成功后该文件对象的
status属性值 GENERIC_ERROR 值为-100，发生通用错误时的错误代码 HTTP_ERROR 值为-200，发生http网络错误时的错误代码，例如服务气端返回的状态码不是200 IO_ERROR 值为-300，发生磁盘读写错误时的错误代码，例如本地上某个文件不可读 SECURITY_ERROR 值为-400，发生因为安全问题而产生的错误时的错误代码 INIT_ERROR 值为-500，初始化时发生错误的错误代码 FILE_SIZE_ERROR 值为-600，当选择的文件太大时的错误代码 FILE_EXTENSION_ERROR 值为-601，当选择的文件类型不符合要求时的错误代码 FILE_DUPLICATE_ERROR 值为-602，当选取了重复的文件而配置中又不允许有重复文件时的错误代码 IMAGE_FORMAT_ERROR 值为-700，发生图片格式错误时的错误代码 IMAGE_MEMORY_ERROR 当发生内存错误时的错误代码 IMAGE_DIMENSIONS_ERROR 值为-702，当文件大小超过了plupload所能处理的最大值时的错误代码
转载自：/2050/p/3913184.html 公告 前端上传组件Plupload使用指南 我之前写过一篇文章《文件上传利器SWFUpload使用指南》，里面介绍了上传组件SWFUpload的使用方法，但
相关阅读排行
相关内容推荐
请激活账号
为了能正常使用评论、编辑功能及以后陆续为用户提供的其他产品，请激活账号。
您的注册邮箱：
如果您没有收到激活邮件，请注意检查垃圾箱。