JQuery上传插件Uploadify API详解
一、相关key值介绍
uploader:uploadify.swf文件的相对路径,该swf文件是一个带有文字BROWSE的按钮,点击后淡出打开文件对话框,默认值:uploadify.swf。
script:后台处理程序的相对路径 。默认值:uploadify.php
scriptData:上传到后台的参数,参数为json格式。
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 :选择文件到文件队列中后的每一个文件上的关闭按钮图标,如下图:
onInit: 做一些初始化的工作。
onSelect:选择文件时触发,该函数有三个参数,参数如下:
event:事件对象。
queueID:文件的唯一标识,由6位随机字符组成。
fileObj:选择的文件对象,有name、size、creationDate、modificationDate、type5个属性。
onSelectOnce:在单文件或多文件上传时,选择文件时触发。该函数有两个参数event,data,data对象有以下几个属性:
fileCount:选择文件的总数。
filesSelected:同时选择文件的个数,如果一次选择了3个文件该属性值为3。
filesReplaced:如果文件队列中已经存在A和B两个文件,再次选择文件时又选择了A和B,该属性值为2。
allBytesTotal:所有选择的文件的总大小。
onCancel: 当点击文件队列中文件的关闭按钮或点击取消上传时触发。该函数有event、queueId、fileObj、data四个参数,前三个参数同onSelect中的三个参数,data对象有两个属性fileCount和allBytesTotal。
fileCount:取消一个文件后,文件队列中剩余文件的个数。
allBytesTotal:取消一个文件后,文件队列中剩余文件的大小。
onClearQueue:当调用函数fileUploadClearQueue时触发。有event和data两个参数,同onCancel中的两个对应参数。
onQueueFull:当设置了queueSizeLimit并且选择的文件个数超出了queueSizeLimit的值时触发。该函数有两个参数event和queueSizeLimit。
onError:当上传过程中发生错误时触发。该函数有event、queueId、fileObj、errorObj四个参数,其中前三个参数同上,errorObj对象有type和info两个属性。
type:错误的类型,有三种‘HTTP’,‘IO’,or‘Security’
info:错误的描述
onOpen:点击上传时触发,如果auto设置为true则是选择文件时触发,如果有多个文件上传则遍历整个文件队列。该函数有event、queueId、fileObj三个参数,参数的解释同上。
onProgress:
点击上传时触发,如果auto设置为true则是选择文件时触发,如果有多个文件上传则遍历整个文件队列,在onOpen之后触发。该函数有event、
queueId、fileObj、data四个参数,前三个参数的解释同上。data对象有四个属性percentage、bytesLoaded、
allBytesLoaded、speed:
percentage:当前完成的百分比
bytesLoaded:当前上传的大小
allBytesLoaded:文件队列中已经上传完的大小
speed:上传速率 kb/s
onComplete:文件上传完成后触发。该函数有四个参数event、queueId、fileObj、response、data五个参数,前三个参数同上。response为后台处理程序返回的值,data有两个属性fileCount和speed:
fileCount:剩余没有上传完成的文件的个数。
speed:文件上传的平均速率 kb/s
注:fileObj对象和上面讲到的有些不太一样,onComplete的fileObj对象有个filePath属性可以取出上传文件的路径。
onAllComplete:文件队列中所有的文件上传完成后触发。该函数有event和data两个参数,data有四个属性,分别为:
filesUploaded :上传的所有文件个数。
errors :出现错误的个数。
allBytesLoaded :所有上传文件的总大小。
speed :平均上传速率 kb/s
二、相关函数介绍
在上面已说了uploadifyUpload和uploadifyClearQueue两个函数,除此之外还有几个函数:
uploadifySettings:可以动态修改上面介绍的那些key值,如下面代码:
$('#uploadify').uploadifySettings('folder','JS');
如果上传按钮的事件写成下面这样,文件将会上传到uploadifySettings定义的目录中
<a href="javascript:$('#uploadify').uploadifySettings('folder','JS');$('#uploadify').uploadifyUpload()">上传</a>
uploadifyCancel:该函数接受一个queueID作为参数,可以取消文件队列中指定queueID的文件。
$('#uploadify').uploadifyCancel(id);
以下是可选项的参数说明:(红色的属性代表常用的)
|
1 |
uploader |
上传控件的主体文件,flash控件 默认值='uploadify.swf' |
|
2 |
script
|
相对路径的后端脚本,它将处理您上传的文件。 绝对路径前缀或'/'或'http'的路径 默认值='uploadify.php' |
|
3 |
checkScript
|
检查该文件是否已经选择驻留在服务器上。 |
|
4 |
scriptData
|
可提供URL传递参数。用来传递get参数。例如: index.jsp?id=1&action=uploadify可以设置成: 'script': 'index.jsp', 'scriptData':{'id':1,'action':'uploadify'}, 注:要设置‘method’:‘GET’.
|
|
5 |
fileDataName
|
您的文件在上传服务器脚本阵列的名称。 |
|
6 |
method
|
设置为发送到后端脚本的方法。要么'get'或post'。 默认值'post' |
|
7 |
scriptAccess
|
? |
|
8 |
folder
|
您想将文件保存到的路径。考虑到安全问题,一般并不在客户端设定后供服务器得到所存的路径。我试了下。这个参数好像以get的方式传递的。设定post得不到这个值。 |
|
9 |
queueID
|
文件队列ID。与div的id一致。参考上一篇例子的用法。 |
|
10 |
queueSizeLimit
|
限制在一次队列中的次数(可选定几个文件)。默认值= 999,而一次可传几个文件有 simUploadLimit属性决定。 |
|
11 |
multi
|
是否允许同时上传多文件,可设定true或false。 默认false。设定true时,选中的文件是当前项。 |
|
12 |
auto |
选定文件后是否自动上传,可设定true或false。 默认false |
|
13 |
fileDesc
|
出现在上传对话框中的文件类型描述。与fileExt需同时使用 |
|
14 |
fileExt
|
支持的格式,启用本项时需同时声明fileDesc。 如:‘*.rar,*.doc
|
|
15 |
sizeLimit
|
控制上传文件的大小,单位byte |
|
16 |
simUploadLimit
|
多文件上传时,同时上传文件数目限制。默认1 一次可传几个文件。 |
|
17 |
buttonText
|
默认按钮的名字。默认BROWER |
|
18 |
buttonImg
|
使用图片按钮,设定图片的路径即可。 |
|
19 |
hideButton
|
上传按钮的隐藏。true 或false。默认flase |
|
20 |
rollover
|
? |
|
21 |
width |
按钮图片的长度。默认 110 |
|
22 |
height
|
按钮图片的高度。默认 30 |
|
23 |
wmode
|
背景透明transparent 与不透明opaque设定。默认 不透明
|
|
24 |
cancelImg
|
取消按钮。设定图片路径。默认cancel.png |
|
25 |
onInit
|
函数, 初始化时的状态。 onInit: function() { $("#id").html("上传前");}, |
|
26 |
onComplete
|
函数:可传递五个参数 event: 事件对象 queueID: 完成文件的唯一标识符。 fileObj: • name – 文件名 • filepath –上传路径 • size – 文件大小 • creationDate – 文件创建时间 • modificationDate –文件最近修改时间 • type –文件的扩展名 response: 服务器回调的数据 data: • fileCount – The total number of files left in the queue • speed – 平均上传速度 KB/s 如: onComplete: function(event, queueID, fileObj) { alert("文件:" +fileObj.name + "上传失败"); } |
|
27 |
onSelectOnce
|
函数:可传递二个参数 event: The event object. data: An object containing details about the select operation. • fileCount – The total number of files in the queue • filesSelected – The number of files selected in the select operation • filesReplaced – The number of files that were replaced in the queue • allBytesTotal – The total number of bytes for all files in the queue |
|
28 |
onCancel
|
函数:可传递四个参数 event: The event object. queueID: The unique identifier of the file that was cancelled. fileObj: An object containing details about the file that was selected. • name – The name of the file • size – The size in bytes of the file • creationDate – The date the file was created • modificationDate – The last date the file was modified • type – The file extension beginning with a '.' data: Details about the file queue. • fileCount – The total number of files left in the queue • allBytesTotal – The total number of bytes left for all files in the queue |
|
29 |
onClearQueue
|
函数:可传递一个参数 event: The event object. |
|
30 |
onQueueFull
|
函数:可传递二个参数 • event - The event object. • queueSizeLimit - The maximum size of the queue.
|
|
31 |
onError
|
函数:可传递四个参数
event: The event object. queueID: The unique identifier of the file that was errored. fileObj: An object containing details about the file that was selected. • name – The name of the file • size – The size in bytes of the file • creationDate – The date the file was created • modificationDate – The last date the file was modified • type – The file extension beginning with a '.' errorObj: An object containing details about the error returned. • type – Either 'HTTP', 'IO', or 'Security' • info – An error message describing the type of error returned
|
|
32 |
onOpen
|
函数:可传递三个参数 event: The event object. queueID: The unique identifier of the file that was opened. fileObj: An object containing details about the file that was selected. • name – The name of the file • size – The size in bytes of the file • creationDate – The date the file was created • modificationDate – The last date the file was modified • type – The file extension beginning with a '.'
|
|
33 |
onProgress
|
函数:可传递四个参数 event: The event object. queueID: The unique identifier of the file that was updated. fileObj: An object containing details about the file that was selected. • name – The name of the file • size – The size in bytes of the file • creationDate – The date the file was created • modificationDate – The last date the file was modified • type – The file extension beginning with a '.' data: An object containing details about the upload and queue. • percentage – The current percentage completed for the upload • bytesLoaded – The current amount of bytes uploaded • allBytesLoaded – The current amount of bytes loaded for all files in the queue • speed – The current upload speed in KB/s
|
|
34 |
onSelect
|
event: The event object. queueID: The unique identifier of the file that was selected. fileObj: An object containing details about the file that was selected. • name – The name of the file • size – The size in bytes of the file • creationDate – The date the file was created • modificationDate – The last date the file was modified • type – The file extension beginning with a '.' |
|
35 |
onAllComplete
|
函数:可传递二个参数
event: The event object. data: An object containing details about the upload process. • filesUploaded – The total number of files uploaded • errors – The total number of errors while uploading • allbytesLoaded – The total number of bytes uploaded • speed – The average speed of all uploaded files |
|
36 |
onCheck
|
函数:可传递五个参数
event: The event object. checkScript: The path to the file checking script. fileQueue: A file queue object consisting of key/value pairs with the queue ID as the key and the filename as the value. folder: The path to the upload folder. single: True if only one file is being uploaded from the queue. |
JQuery上传插件Uploadify API详解的更多相关文章
- 【转】JQuery上传插件Uploadify使用详解及错误处理
转自:http://www.jb51.net/article/43498.htm 关于JQuery上传插件Uploadify使用详解网上一大把,基本上内容都一样.我根据网上的步骤配置完成后,会报一些错 ...
- JQuery上传插件Uploadify使用详解
本文转载http://www.cnblogs.com/oec2003/archive/2010/01/06/1640027.html Uploadify是JQuery的一个上传插件,实现的效果非常不错 ...
- (转)JQuery上传插件Uploadify使用详解
原文地址:http://www.cnblogs.com/oec2003/archive/2010/01/06/1640027.html Uploadify是JQuery的一个上传插件,实现的效果非常不 ...
- JQuery上传插件Uploadify使用详解 asp.net版
先来一个实例 Uploadify插件是JQuery的一个文件支持多文件上传的上传插件,ajax异步上传,实现的效果非常不错,带进度显示.不过官方提供的实例时php版本的,本文将详细介绍Uploadif ...
- JQuery上传插件uploadify优化
旧版的uploadify是基于flash上传的,但是总有那么些问题,让我们用的不是很舒服.今天主要分享下在项目中用uploadify遇到的一些问题,以及优化处理 官方下载 官方文档 官方演示 下面是官 ...
- jquery上传插件uploadify 报错http error 302 解决方法之一
前段时间用到jquery上传插件uploadify时,始终出现系统报出 http error 302 的错误. 网上大量搜集信息,基本上都是说session值丢失的问题,根据网友提供的解决方案进行修改 ...
- jQuery上传插件Uploadify使用帮助
Uploadify是JQuery的一个上传插件,实现的效果非常不错,带进度显示.它的功能特色总结如下: 支持单文件或多文件上传,可控制并发上传的文件数 在服务器端支持各种语言与之配合使用,诸如PHP, ...
- JQuery上传插件Uploadify详解及其中文按钮解决方案 .
Uploadify有一个参数是 buttonText 这个无论你怎么改都不支持中文,因为插件在js里用了一个转码方法把这个参数的值转过码了,解码的地方在那个swf文件里,看不到代码,所以这条路不行. ...
- 文件上传利器JQuery上传插件Uploadify
在做日常项目中,经常在后台需要上传图片等资源文件,之前使用过几次这个组件,感觉非常好用 ,但是每次使用的时候都是需要经过一番查阅,所以还不如记住在这里,以后使用的时候就翻翻. 他的官方网站如下:htt ...
随机推荐
- ripple
ripple模拟器非常好用,chrome上的插件
- P140、面试题24:二叉搜索树的后序遍历序列
题目:输入一个整数数组,判断该数组是不是某二叉搜索树的后序遍历的结果.如果是则返回true,否则返回false.假设输入的数组的任意两个数字都互不相同. 测试用例: 1)功能测试(输入的后序遍历的序列 ...
- java事务管理(二)
数据库事务和Spring事务是一般面试都会被提到,很多朋友写惯了代码,很少花时间去整理归纳这些东西,结果本来会的东西,居然吞吞吐吐答不上来. 下面是我收集到一些关于Spring事务的问题,希望能帮助大 ...
- (转)Decision Tree
Decision Tree:Analysis 大家有没有玩过猜猜看(Twenty Questions)的游戏?我在心里想一件物体,你可以用一些问题来确定我心里想的这个物体:如是不是植物?是否会飞?能游 ...
- NFC(12)使用Android Beam技术传输文本数据及它是什么
Android Beam技术是什么 Android Beam的基本理念就是两部(只能是1对1,不可像蓝牙那样1对多)NFC设备靠近时(一般是背靠背),通过触摸一部NFC设备的屏幕,将数据推向另外一部N ...
- 在Google被封的那些日子裏,我們這樣科學上網
回到正題,如果某天你喜歡的網站被封了,你工作的郵箱無法訪問了,該如何用正確姿勢實現科學上網呢?雷鋒網為大家整理了數個小技巧. 1.FreeGate類傻瓜工具 很多人第一次用翻墻,應該是從FreeGat ...
- LeetCode Excel Sheet Column Title (输出excel表的列名称)
题意:给一个数字n,输出excel表的列名称. 思路:其实观察可知道,是个26进制的标记而已.那就模拟一下,每次计算一位时就先左移1位,再进行计算. class Solution { public: ...
- Java [Leetcode 226]Invert Binary Tree
题目描述: Invert a binary tree. 4 / \ 2 7 / \ / \ 1 3 6 9 to 4 / \ 7 2 / \ / \ 9 6 3 1 解题思路: 我只想说递归大法好. ...
- Entity Framework 数据生成选项DatabaseGenerated
在EF中,我们建立数据模型的时候,可以给属性配置数据生成选项DatabaseGenerated,它后有三个枚举值:Identity.None和Computed. Identity:自增长 None:不 ...
- the type initializer for '' threw an exception
the type initializer for '' threw an exception 问题:程序启动时初始化主窗口类时,弹出该错误.调查:查看类的构造函数是否会有异常抛出.解决:去掉类的构造函 ...