jQuery无刷新上传组件Uploadify 30参数详解.doc

jQuery Uploadify 是一个强有力的而且可以高度自定义的文件上传插件，它是基于jQuery 和 SWFUpload 来开发的，支持进度条显示，实现的效果非常不错。可以见下图：从Uploadify 的下载页面上，可以看到当前的版本已经是Uploadify-v3.0.0 (Beta)，但是还是一个Beta版，所以目前来说网站上的文档主要是针对 uploadify v2.14 的。所以这里就不多介绍老版本的文档了，主要说一下Uploadify3.0 的一些用法。Uploadify 的v3.0 和老版本还是有很大的差别的，虽然从演示上来看基本上一样，但是jquery调用uploadify的时候，一些很重要的参数名字都变了。在演示上的差别，老版本是把按钮的样式放在flash里，而v3.0把按钮的样式和flash 分开了，定义起来更加自由。下面来说一下v3.0 的使用方法和有哪些参数上变化：使用方法：123456789101112131415161718192021 $(document).ready(function() $(#file_upload).uploadify( uploader : /uploadify/uploadify.php, swf : /uploadify/uploadify.swf, cancelImage : /uploadify/uploadify-cancel.png, auto : true ); ); 在页面中首先要uploadify 依赖的两个js 库：jquery 和 swfobject， 然后再加入从网上下载的 jquery.uploadify.js。 到目前为止，准备工作已经就绪，下面开始使用 jQuery.uploadify() 函数。传入指定的参数后，uploadify 就会按照你的要求来工作了。Uploadify v3.0的参数详解下面的参数参数是必须的，当然插件也已经给他们赋上了必要的默认值123id : jQuery(this).attr(id), / 根据页面上绑定的对象来给uploadify设置id swf : uploadify.swf, / uploadify的上传功能是通过flash 来实现的，swf 是用来设置这个flash 的位置，这个flash 可以在下载的插件包里找到 uploader : uploadify.php, / 这个参数是当文件上传完以后调用的代码的地址下面的参数是可选的参数:123456789101112131415161718192021222324252627/ Options auto : false,/ 设置选完文件是否自动上传 buttonClass : , / 可以为按钮自定义样式 buttonCursor : hand, / 设置档鼠标移动到flash 上显示的图标 buttonImage : false, / 设置按钮的图片 buttonText : SELECT FILES, / 设置按钮上显示的文本 cancelImage : uploadify-cancel.png, / 设置取消按钮的图片 checkExisting : uploadify-check-existing.php, / 检查上传的文件时候已经存在 debug : false, / uploadify de调试程序是否开启 fileObjName : Filedata, /服务器端用于接受文件的表单名称 fileSizeLimit : 0, / 设置文件的上传的大小，0为无穷大 fileTypeDesc : All Files (*.*), fileTypeExts : *.*, /设置文件上传时的文件类型 height : 30, / 设置flash 的高度 method : post, / 设置提交的方法 multi : false, / 是否支付多文件一起上传 queueID : false, /队列ID,如果为false,则动态设置 queueSizeLimit : 999, /队列中,同时上传的文件个数 removeCompleted : true,/文件上传完成自动清除队列,设为false则不清除 removeTimeout : 3,/在上次完成之前删除队列时延迟时间 requeueErrors : false,/如果设置为true,上传错误的文件将多次重新上传 postData : , / 设置上传是需要传入的参数 preventCaching : true,/在swf的URL随机加入字符串,以防止缓存 progressData : percentage,/设置队列显示类型,percentage为百分比,speed为速度 successTimeout : 30,/上传完成后,等待几秒用于得到服务器响应 uploadLimit : 999, /上传队列中的最大值 width : 120, / 设置flash 的宽度下面是一些可能需要的函数:onCancel有一个file参数,可以以方式获取文件名.用于移除没上成或是正在上传的文件.onClearQueue用于清空当前上传的队列,一个参数queueItemCount.用于指定当前队列中正在上传的个数.onDestroy无参数,用于销毁flash上传插件.onDialogClose当浏览文件对话框被关闭时触发,有一个queueData参数,可以调用5个属性.filesSelected被选中文件的个数filesQueued添加到上传队列的文件的数量(如果出错,不会返回错误信息)filesReplaced替换当前队列的文件的个数.filesCancelled已经位于上传队列,但是被取消的文件个数(不包含被替换)filesErrored上传出错的文件的个数onDialogOpen当打开浏览文件对话框时立即触发.该函数没有参数.onEnable与onDestroy函数相对,用于启用flash上传插件.onFallback当检测到浏览器中没有兼容的flash版本的时候触发.onInit初始化 Uploadify 时触发.有一个参数instance,返回的是一个Uploadify对象.onQueueComplete当队列中所有文件上传完毕时触发函数.有一个参数:queueData有两个属性uploadsSuccessful上传成功的个数uploadsErrored上传出错的个数onSelect当选中文件时触发,存在一个文件对象file.onSelectError当选中的文件出错时触发.存在三个参数:file返回一个文件对象errorCode错误码QUEUE_LIMIT_EXCEEDED文件队列中所有文件个数FILE_EXCEEDS_SIZE_LIMIT文件大小的限制ZERO_BYTE_FILE空文件INVALID_FILETYPE不匹配的文件类型errorMsg错误消息onSWFReady当flash插件装在完毕时触发,没有参数.onUploadComplete当队列中每个文件上传完成时触发一次.存在一个文件对象file参数.如果存在错误,则是一个错误信息.onUploadError当文件已经发送到服务器端,但是出现错误时触发.该函数有四个参数:file文件对象,包含文件大小,文件名,文件类型等属性.errorCode返回的错误码errorMsg返回的错误信息errorString易读的详细错误信息.onUploadProgress当上传进度条更新时触发.存在五个参数.file文件对象,包含文件大小,文件名,文件类型等属性.bytesUploaded已发送的文件字节数bytesTotal文件大小totalBytesUploaded上传队列中已上传的文件大小totalBytesTotal上传队列中所有文件的大小onUploadStart当文件上传之前触发. 存在一个文件对象file.onUploadSuccess当每个文件上传成功时触发. 存在三个参数:file文件对象,包含文件大小,文件名,文件类型等属性.data服务器端返回的数据response返回服务端响应数据可选的调用模式:cancel用于对文件队列进行操作.有两个参数:1. fileID要取消的文件ID, 当指定该参数时,会取消文件队列中指定文件,如果不指定,只会取消第一个文件,如果想取消全部文件,可以用*作为参数.2. suppressEvent如果该参数为true,不会调用onUploadCancel函数.调用方法:12 取消第一个文件 | 清空上传队列 | 上传所有文件destroy用于销毁Uploadify对象.该函数没有参数.调用方法:12 销毁 Uploadifydisable该模式用于禁用或启用文件选择按钮,存在一个参数.1. setDisabled如果设置为true则禁用按钮,如果是false则启用按钮.调用方法:12 Disable the Button | Enable the Buttonsettings用于重新设置 Uploadify 对象的一个参数.o name想要修改参数的名称.o value想要更改的值o resetObjects如果该值为true,当更改的值已存在会替换,不存在会添加.调用方法:12 Change the Button Text | Read the Button1234567891011121314$(function() (#file_upload).uploadify( swf?: /uploadify/uploadify.swf, uploader : /uploadify/uploadify.php); ); function changeBtnText() $(#file_upload).uploadify(settings,buttonText,BROWSE); function returnBtnText() alert(The button says + $(#file_upload).uploadify(settings,buttonText); sto