Uploadify是一款基于JQuery的优秀的文件/图片上传的插件,有基于Flash和HTML5两种版本。

Uploadify/uploadifive主要特点有:
1. 多文件上传
2. 个性化设置
3. 上传进度条显示

4. 拖拽上传(HTML5版本)

官网:http://www.uploadify.com

在部署一个Uploadify实例前,请确保满足最低要求:

  • 1.jQuery 1.4.x 或更高版本
  • 2.Flash Player 9.0.24 或更高版本
  • 3.支持PHP, ASP.Net, Cold Fusion的服务器环境(官方默认支持PHP)

下载最新版本的uploadify,解压到服务器根目录下的uploadify文件夹中,你可以看到以下文件:

  • Change Log.txt(uploadify的升级日志,部署时删掉)
  • check-exists.php(用来检查上传目标文件夹里是否存在相同文件)
  • index.php(官方实例)
  • jquery.uploadify.js(上传插件)
  • jquery.uploadify.min.js(压缩版的上传插件,部署时使用)
  • license.txt(许可证文件,部署时删掉)
  • uploadify.css(上传控件样式表)
  • uploadify.php(上传数据处理文件)
  • uploadify.swf(flash基础文件)
  • uploadify-cancel.png(取消按钮图片)

在官方提供的实例文件中,是引用的jquery官方网站上的jquery库,有需要的朋友还需要本地引用jquery库。

下面我们看一看如何在你的项目上部署uploadify:

1.我们假定上传控件部署在网站根目录下的upload.

php中,uploadify文件夹位于网站根目录中,上传的文件保存在根目录下的upload文件夹中,uploadify文件夹中包含check-exists.php、jquery.min.js 、jquery.uploadify.min.js、uploadify.css、uploadify.swf、uploadify-cancel.png。

2.引用jquery库

  1. <script type="text/javascript" "/uploadify/jquery.min.js"></script>

3.引用uploadify脚本

  1. <script type="text/javascript" "/uploadify /jquery.uploadify.min.js"></script>

4.引用uploadify样式表

  1. <link "stylesheet" type="text/css" href="uploadify.css" />

5. 声明一个普通的html文件上传控件,并指定id

  1. <input "file_upload" name="file_upload" type="file" multiple="true">

6. 将声明的普通上传控件与Uploadify插件绑定,并初始化

  1. <script type="text/javascript">
  2. $function
  3. $‘#file_upload‘.uploadify
  4. ‘swf‘      : ‘/uploadify uploadify.swf‘,    //指定上传控件的主体文件
  5. ‘uploader‘ : ‘/uploadify uploadify.php‘    //指定服务器端上传处理文件
  6. //其他配置项
  7. </script>

auto

设置auto为true,当文件被添加至上传队列时,将会自动上传。

buttonClass

为上传按钮添加类名。

buttonCursor

鼠标经过上传按钮时,鼠标的形状。可选值为‘hand’(手形) 和 ‘arrow’(箭头)。

buttonImage

定义“浏览”按钮背景图像的路径。给按钮设置背景图像的代码最好写在CSS文件中。

buttonText

定义显示在默认按钮上的文本。

checkExisting

定义检查目标文件夹中是否存在同名文件的脚本文件路径。

debug

当其值为true时,开启SWFUpload调试模式。

fileObjName

定义上传数据处理文件中接收数据使用的文件对象名。

fileSizeLimit

上传文件大小限制。

fileTypeDesc

可选择的文件类型的描述。此字符串出现在浏览文件对话框的文件类型下拉菜单中。

fileTypeExts

定义允许上传的文件后缀。

formDataJSON对象

定义在文件上传时需要一同提交的其他数据对象。

height

上传按钮的高度(单位:像素)。

itemTemplate

itemTemplate选项允许你为每一个添加到队列中选项设定一个不同HTML模板。

method

上传文件的提交方法,取值‘post‘或‘get‘。

multi

设置值为false时,一次只能选中一个文件。

overrideEvents

该项定义了一组默认脚本中你不想执行的事件名称。

preventCaching

如果设置为真,一个随机的值添加到SWF文件的URL,因此它不会缓存。

progressData

设置显示在上传进度条中的数据类型,可选项时百分比(percentage)或速度(speed)。

queueID

queueID选项允许你设置一个拥有唯一ID的DOM元素来作为显示上传队列的容器。

queueSizeLimit

上传队列中一次可容纳的最大条数。

removeCompleted

不设置该选项或者将其设置为false,将使上传队列中的项目始终显示于队列中,直到点击了关闭按钮或者队列被清空。

removeTimeout

设置上传完成后从上传队列中移除的时间(单位:秒)。

requeueErrors

设置为真时,上传队列重置或上传多次重试时,返回错误信息。

successTimeout

表示uploadify的成功等待时间(单位:秒,默认30秒)。

swf

定义uploadify.swf的路径。

uploader

定义服务器端上传数据处理脚本文件uploadify.swf的路径。

uploadLimit

定义允许的最大上传数量。

width

定义浏览按钮的宽度。

onCancel

设置onCancel选项,在文件上传被取消时,将允许运行一个自定义函数。

onClearQueue

设置onClearQueue选项,上传队列清空(激活ancel方法)时,将允许运行一个自定义函数。

onDestroy

销毁Uploadify实例(调用destroy方法)时触发该事件。

onDialogClose

当浏览文件对话框关闭时触发该事件。如果该事件被添加到overrideEvents属性中,在添加文件到队列中发生错误时,将不会弹出默认错误信息。

onDialogOpen

在浏览文件对话框被打开前一瞬触发该事件。

onDisable

调用disable方法禁用Uploadify实例时触发该事件。

onEnable

调用disable方法启用Uploadify实例时触发该事件。

onFallback

浏览器检测不到兼容版本的Flash时触发该事件。

onInit

调用Uploadify初始化结束时触发该事件。

onQueueComplete

队列中的所有文件被处理完成时触发该事件。

onSelect

每添加一个文件至上传队列时触发该事件。

onSelectError

选择文件返回错误时触发该事件。每一个文件返回错误都会触发该事件。

onSWFReady

当flash按钮载入完毕时触发该事件。

onUploadComplete

每一个文件上传完成都会触发该事件,不管是上传成功还是上传失败。

onUploadError

上传失败时触发该事件。

onUploadProgress

上传进度更新时触发该事件。

onUploadStart

在开始上传之前的瞬间会触发该事件。

onUploadSuccess

每一个文件上传成功时触发该事件。

cancel

取消上传对象。

destroy

销毁Uploadify实例,并返回原文件域。

disable

控制浏览按钮是否可用。

settings

返回或更新一个Uploadify实例的值。

stop

停止当前上传。

upload

上传指定文件或队列中的所有文件。

uploadfy api中文文档的更多相关文章

  1. jQuery 3.1 API中文文档

    jQuery 3.1 API中文文档 一.核心 1.1 核心函数 jQuery([selector,[context]]) 接收一个包含 CSS 选择器的字符串,然后用这个字符串去匹配一组元素. jQ ...

  2. jQuery EasyUI API 中文文档 - ComboGrid 组合表格

    jQuery EasyUI API 中文文档 - ComboGrid 组合表格,需要的朋友可以参考下. 扩展自 $.fn.combo.defaults 和 $.fn.datagrid.defaults ...

  3. jQuery EasyUI API 中文文档 - ValidateBox验证框

    jQuery EasyUI API 中文文档 - ValidateBox验证框,使用jQuery EasyUI的朋友可以参考下.   用 $.fn.validatebox.defaults 重写了 d ...

  4. jQuery EasyUI API 中文文档

    http://www.cnblogs.com/Philoo/tag/jQuery/ 共2页: 1 2 下一页  jQuery EasyUI API 中文文档 - 树表格(TreeGrid) 风流涕淌 ...

  5. jQuery API中文文档

    jQuery API中文文档 http://www.css88.com/jqapi-1.9/category/events/event-handler-attachment/ jQuery UI AP ...

  6. Web3.js API 中文文档

    Web3.js API 中文文档 http://web3.tryblockchain.org/Web3.js-api-refrence.html web3对象提供了所有方法. 示例: //初始化过程 ...

  7. 以太坊智能合约开发,Web3.js API 中文文档 ethereum web3.js入门说明

    以太坊智能合约开发,Web3.js API 中文文档 ethereum web3.js入门说明 为了让你的Ðapp运行上以太坊,一种选择是使用web3.js library提供的web3.对象.底层实 ...

  8. Etherscan API 中文文档-交易以及检查交易收据状态

    本文原文链接 点击这里获取Etherscan API 中文文档(完整版) 完整内容排版更好,推荐读者前往阅读. 交易(Transaction) 交易相关的 API,接口的参数说明请参考Ethersca ...

  9. Etherscan API 中文文档-智能合约

    本文原文链接 点击这里获取Etherscan API 中文文档(完整版) 完整内容排版更好,推荐读者前往阅读. 智能合约(Contracts) 智能合约相关的 API,接口的参数说明请参考Ethers ...

随机推荐

  1. Mysql Concat()bug

    1.http://bugs.mysql.com/bug.php?id=12030 CONCAT with INTEGER modifies result-set encoding 2.这个bug的修改 ...

  2. 关于C#的内存释放问题

    最近在做一个要循环读取xml文件的功能. 想法是读取一个文件,释放一个文件,这样就不会消耗太多内存. 结果运行起来内存不停涨,最后内存溢出.用gc,disponse,异步都没有用. 后来改成relea ...

  3. 清除mysql表中数据

    delete from 表名; truncate table 表名; 不带where参数的delete语句可以删除mysql表中所有内容,使用truncate table也可以清空mysql表中所有内 ...

  4. Cairo 下载,测试

    You need to download the all-in-one bundle available here. You can discover this link yourself by vi ...

  5. 【python】属性

    在python中,一切皆是对象(object),对象拥有很多属性(arrtribute) 属性分2种 类属性(class attribute):类自身定义or继承 对象属性(object attrib ...

  6. SSH面试题收藏

    Hibernate工作原理及为什么要用? 原理: 1. 读取并解析配置文件2. 读取并解析映射信息,创建SessionFactory3. 打开Sesssion4. 创建事务Transation5. 持 ...

  7. 关于解析P D X P 协议的心得

    1一个线程进队Quee 一个线程出队 也应该lock,不然会出错. 2 委托的效率较低 能不用委托的地方,尽量不要用委托. 在一个线程中需要调用控件时采用委托. 3 for循环中异步发送数据不能保证发 ...

  8. docker基本操作

    centos 7 安装docker 目前,CentOS 仅发行版本中的内核支持 Docker. Docker 运行在 CentOS 7 上,要求系统为64位.系统内核版本为 3.10 以上. Dock ...

  9. oracle xmltype导入并解析Excel数据 (一)创建表与序

    表说明: T_EXCEL_IMPORT_DATASRC: Excel数据存储表,(使用了xmltype存储Excel数据) 部分字段说明: BUSINESSTYPE: Excel模板类型,一个Exce ...

  10. re.S

    在Python的正则表达式中,有一个参数为re.S.它表示多行匹配