前端之家收集整理的这篇文章主要介绍了
详解jQuery uploadify文件上传插件的使用方法,
前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
uploadify这个插件是基于js里面的jquery库写的。结合了ajax和flash,实现了这个多线程上传的功能。
现在最新版为3.2.1。
在线实例
实例中用到的PHP文件UploaderDemo.PHP请在页面下方下载
参数说明
属性
属性名称文件后就直接上传了,为false需要点击上传按钮才上传 。图片的路径 。文件上传重复性检查程序,检查即将上传的文件在服务器端是否已存在,存在返回1,不存在返回0文件上传对象的名称,如果命名为'the_files',PHP程序可以用$_FILES['the_files']来处理上传的文件对象。上传文件的大小限制 ,如果为整数型则表示以KB为单位的大小,如果是字符串,则可以使用(B,KB,MB,or GB)为单位,比如'2MB';
属性值必须设置fileTypeExts属性后才有效,用来设置选择文件对话框中的提示文本,如设置fileTypeDesc为“请选择rar doc pdf文件”文件的类型,格式如:'*.doc;*.pdf;*.rar' 。上传每个文件的同时提交到服务器的额外数据,可在'onUploadStart'事件中使用'settings'方法动态设置。上传队列的HTML模版,可以使用以下标签:
instanceID – Uploadify实例的ID
fileID – 列队中此文件的ID,或者理解为此任务的ID
fileName – 文件的名称
fileSize – 当前上传文件的大小
插入模版标签时使用格式如:${fileName}上传多个文件。上传文件时自动加上一串随机字符串参数,防止URL缓存影响上传结果上传进度显示方式,percentage显示上传百分比,speed显示上传速度上传队列容器DOM元素的ID,如果为false则自动生成一个队列容器。显示的任务数量,如果选择的文件数量超出此限制,将会出发onSelectError事件。
注意此项并非最大文件上传数量,如果要限制最大上传文件数量,应设置uploadLimit。自动将已完成任务从队列中删除,如果设置为false则会一直保留此任务显示。自动从队列中移除,则可以规定从完成到被移除的时间间隔。上传失败后将返回错误,并重新加入任务队列上传。文件上传成功后服务端应返回成功标志,此项设置返回结果的超时时间文件的相对路径。PHP后台处理程序的相对路径。上传文件数量,如果达到或超出此限制将会触发onUploadError事件。文件浏览按钮的宽度。
名称文件队列中文件的关闭按钮或点击取消上传时触发,file参数为被取消上传的文件对象
调用函数cancel方法时触发,queueItemCount参数为被取消上传的文件数量。方法被调用时触发文件浏览框关闭时触发,如果将此事件被重写,则当向队列添加文件上传出错时不会弹出错误消息提示。
属性:
filesSelected 文件选择对话框中共选择了多少个文件
- filesQueued 已经向队列中添加了多少个文件
- filesReplaced 已经向队列中替换了多少个文件
- filesCancelled 取消了多少个文件 filesErrored 出错了多少个文件
logopen()文件选择对话框弹出时立即出发,但可能在文件选择对话框被关闭之前并不能全部执行。方法禁用Uploadify上传按钮时被调用时触发。方法启用Uploadify上传按钮时被调用时触发。不支持flash时触发。文件上传队列处理完毕后触发。
属性:
文件后向队列中添加每个上传任务时都会触发。
文件后向队列中添加每个上传任务时如果失败都会触发。
文件对象
错误代码如下:
QUEUE_LIMIT_EXCEEDED – 任务数量超出队列限制;
- FILE_EXCEEDS_SIZE_LIMIT – 文件大小超出限制;
- ZERO_BYTE_FILE – 文件大小为0
- INVALID_FILETYPE – 文件类型不符合要求
错误提示,可通过'this.queueData.errorMsg'定制
文件载入成功后触发。文件上传完毕后无论成功与否都会触发。文件上传出错时触发,参数由服务端程序返回。上传队列的过程中会多次触发此事件,每当任务状态有更新时都会触发。
file – 文件对象
- bytesUploaded – 已上传的字节数
- bytesTotal – 文件总字节数
- totalBytesUploaded – 当前任务队列中全部文件已上传的总字节数
- totalBytesTotal – 当前任务队列中全部文件的总字节数
文件即将开始上传时立即触发文件上传成功时触发
file – 文件对象
- data – 服务端输出返回的信息
response – 有输出时为true,如果无响应为false,如果返回的是false,当超过successTimeout设置的时间后假定为true
方法
方法名称上传
fileID – 要取消的文件ID,如果为空则取消队列中第一个任务,如果为'*'则取消所有任务
- suppressEvent – 是否阻止触发onUploadCancel事件,当清空队列时非常实用。
文件上传按钮恢复到原始状态
文件浏览按钮
获取或设置Uploadify实例参数
name – 属性名称,如果只提供属性名称则表示获取其值
- value – 属性值
- resetObjects – 设置为true时,更新postData对象将清空现有的值。否则,新的值将被添加到其末尾。
上传的任务
上传指定的文件,如果fileID为'*'表示上传所有文件,要指定上传多个文件,则将每个文件的fileID作为一个参数
文件UploaderDemo.PHP下载
以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持编程之家!
原文链接:https://www.f2er.com/jquery/43454.html