开发者社区> 老朱教授> 正文

【转】JQuery插件 - Uploadify (简单易用的上传插件)

简介:
+关注继续查看
·概述   
Uploadify 是一个JQuery插件,它协助你轻松简单的将一个或多个文件上传至你的网站。   
它需要Flash控件和后台开发语言的支持,丰富的参数配置,同时也简单易用,让你轻松上手。   

官方网站:http://www.uploadify.com/   
官方示例:http://www.uploadify.com/demo/   
开发文档:http://www.uploadify.com/documentation/   
插件下载:http://www.uploadify.com/download/   

·参考文献   
(PS:我是在这篇文章里知道这世界上有这样一个插件的 ^_^ 里面有后台C#代码)   
易用的JQuery上传插件Uploadify   
http://css9.net/jquery-muti-file-upload-uploadify/   

·参数   
uploader   
设置uploadify.swf文件的相对或绝对路径。默认值:'uploadify.swf' 

script   
设置用于处理文件上传的后台程序页面的相对或绝对路径。默认值:'upload.php' 

checkScript   
设置用于检查规则的后台程序页面的相对或绝对路径。   

scriptData   
一个键值对应的数据,它将连同文件一起传给后台程序页面。示例:{'name':'value'}   

fileDataName   
设置上传控件的名称。默认值:'Filedata' 

method   
设置scriptData提交的方式。可选值:GET,POST 默认值:'POST' 

scriptAccess   
设置Flash的访问模式。如果是本地测试,可设置为'always'。默认值:'sameDomain' 

folder   
设置文件保存的目录。不能以'/'结束。   

queneID   
设置文件队列里的元素的ID,默认情况下,在点击浏览按钮后 自动创建。   

queueSizeLimit   
设置文件队列的最大值。默认值:999   

multi   
设置为true表示允许上传多个文件。   

auto   
设置为true表示当选择一件附件后,自动开始上传。   

fileDesc   
设置文件浏览对话框中的文件类型下拉框的显示文本。   

fileExt   
设置允许上传的文件类型,如:'*.ext1;*. ext2;*.ext3'。如果设置此选项,则必须设置fileDesc。   

sizeLimit   
设置允许的单文件大小。单位:字节   

simUploadLimit   
设置同时上传文件的数量。默认值:1   

buttonText   
设置上传按钮的文本。默认值:'BROWSE' 

buttonImg   
设置浏览按钮的图片。   

hideButton   
设置为true则隐藏按钮图片。   

rollover   
Set to true if you would like to activate rollover states for your browse button. To prepare your browse button for rollover states, simple add the ‘over’ and ‘press’ states below the normal state in a single file.   

width   
设置按钮图片和flash文件的宽度。默认值:30   

height   
设置按钮图片或flash文件的高度。如果rollover为true,则是实际大小的1/3。默认值:110   

wmode   
设置为transparent则flash的背景将变成透明,并且在页面所有元素的最顶层。默认值:'opaque' 

cancelImg   
设置取消按钮的图片路径。默认值:cancel.png   

onInit   
当插件加载时触发此事件,默认会将页面上的目标元素转换成flash文件并添加容器,如果返回false则不会执行此动作。   

onSelect   
当选中一个文件后触发此事件,默认会创建一个6位的随机编号的元素,并加入到文件队列中,如果返回false则不会执行此动作。   
此事件有三个参数:   
event: javascript的event对象   
queueID: 选中文件的编号   
fileObj: 一个包含文件详细信息的对象。   
    name – 文件名称   
    size – 文件的大小(字节)   
    creationDate – 文件的创建时间   
    modificationDate – 文件的修改时间   
    type – 文件的扩展名(包括'.')   

onSelectOnce   
当执行选中操作时触发此事件,该事件没有默认的处理程序。   
此事件有两个参数:   
event: javascript的event对象   
data: 一个包含选择操作详细信息的对象。   
    fileCount – 队列中的文件总数   
    filesSelected – 在选择操作中选中的文件数   
    filesReplaced – 在队列中被替换的文件数   
    allBytesTotal – 队列中所有文件的大小(字节)   

onCancel   
当一个文件上传被取消或在队列中被删除时触发此事件。默认事件将会将此文件的名称从队列中移除,如果返回false则不执行此动作。   
此事件有四个参数:   
event: javascript的event对象。   
queueID: 被取消(移除)的文件的编号   
fileObj: 被取消(移除)的文件的详细信息。(见onSelect)   
data: 文件队列的详细信息。   
    fileCount – 在文件队列中剩余的文件的数量   
    allBytesTotal – 在文件队列中剩余的文件的大小(字节)   

onClearQueue   
当调用fileUploadClearQueue函数时触发此事件。默认事件会移除文件队列中的所有元素,如果返回false则不执行此动作。   
此事件有两个参数:   
event: javascript的event对象。   
data: 被调用此事件的文件队列的详细信息。   
    fileCount – 上传队列的文件数   
    allBytesTotal – 上传队列的兽性大小(字节)   

onQueueFull   
当队列达到设定的最大值后触发此事件,默认事件会提示用户队列数量。   
此事件有两个参数:   
event: javascript的event对象。   
queueSizeLimit: 队列最大值。   

onError   
当上传文件发生异常时触发此事件,默认事件会将元素变成红色并提示相应的错误信息。   
此事件有四个参数:   
event: javascript的event对象。   
queueID: 发生错误的元素的唯一编号。   
fileObj: 发生错误的元素的文件详细信息。(见onSelect)   
errorObj: 发生错误时的错误详细信息。   
    type – 分别是:'HTTP', 'IO', 'Security'三者之一    
    info – 错误信息描述   

onOpen   
当选择一个文件后,Flash文件初始化此文件时触发此事件。没有默认事件。   
此事件有三个参数:   
event: javascript的event对象。   
queueID: 文件的元素的唯一编号。   
fileObj: 文件的详细信息。   

onProgress   
当上传文件时,进度发生改变时触发此事件。默认事件会更新文件队列中的进度条。如果返回false则不执行此动作。   
此事件有四个参数:   
event: javascript的event对象。   
queueID: 文件的元素的唯一编号。   
fileObj: 文件的详细信息。   
data: 一个关于文件与队列的详细信息的对象。   
    percentage – 当前文件上传完成的百分比。   
    bytesLoaded – 当前文件已上传的字节数   
    allBytesLoaded – 文件的总字节数   
    speed – 当前上传的速度(KB)   

onComplete   
当文件上传完成后触发此事件,默认事件会更新文件队列的相关状态。如果返回false则不执行此动作。   
此事件有五个参数:   
event: javascript的event对象。   
queueID: 文件的元素的唯一编号。   
fileObj: 文件的详细信息。   
response: 从服务器发回的数据。   
data: 文件队列的详细信息。   
    fileCount – 文件队列的文件总数   
    speed – 文件上传的平均速度(KB)   

onAllComplete   
当所有文件上传完毕后触发此事件。没有默认事件。   
此事件有两个参数:   
event: javascript的event对象。   
data: 上传过程的详细信息   
    filesUploaded – 此次上传的文件数量   
    errors – 上传过程的错误次数   
    allBytesLoaded – 此次上传的文件总大小(字节)   
    speed – 此次上传的平均速度(KB)   

onCheck   
当检查到服务器已存在此文件时触发此事件,默认事件是弹出确认框。   
此事件有五个参数:   
event: javascript的event对象。   
checkScript: 检查文件的后台程序页面。   
fileQueue: 一个队列({'唯一编号','文件名称'}的对象。   
folder: 上传的路径。   
single: 如果为true表示只有一个文件正准备上传至服务器。   

·方法   
uploadifySettings(setting, value)   
用于获取或设置插件的参数。   
获取:#(’#someID’).uploadifySettings(’queueSize’);   
设置:$(’#someID’).uploadifySettings(’folder’,'/uploads’);   

uploadifyUpload([queueID])   
用于开始上传一个或所有文件。   
示例:$(’#someID’).uploadifyUpload();   

uploadifyCancel(queueId)   
用于停止上传或队列中取消一个文件。   
示例:$(’#someID’).uploadifyCancel(’NFJSHS’);   

uploadifyClearQueue()   
用于清除当前文件队列中的所有文件。   
示例:$(’#someID’).uploadifyClearQueue(); 



本文转自黄聪博客园博客,原文链接:http://www.cnblogs.com/huangcong/archive/2011/03/23/1992581.html,如需转载请自行联系原作者

版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

相关文章
如何设置阿里云服务器安全组?阿里云安全组规则详细解说
阿里云安全组设置详细图文教程(收藏起来) 阿里云服务器安全组设置规则分享,阿里云服务器安全组如何放行端口设置教程。阿里云会要求客户设置安全组,如果不设置,阿里云会指定默认的安全组。那么,这个安全组是什么呢?顾名思义,就是为了服务器安全设置的。安全组其实就是一个虚拟的防火墙,可以让用户从端口、IP的维度来筛选对应服务器的访问者,从而形成一个云上的安全域。
16700 0
阿里云服务器怎么设置密码?怎么停机?怎么重启服务器?
如果在创建实例时没有设置密码,或者密码丢失,您可以在控制台上重新设置实例的登录密码。本文仅描述如何在 ECS 管理控制台上修改实例登录密码。
18903 0
阿里云ECS云服务器初始化设置教程方法
阿里云ECS云服务器初始化是指将云服务器系统恢复到最初状态的过程,阿里云的服务器初始化是通过更换系统盘来实现的,是免费的,阿里云百科网分享服务器初始化教程: 服务器初始化教程方法 本文的服务器初始化是指将ECS云服务器系统恢复到最初状态,服务器中的数据也会被清空,所以初始化之前一定要先备份好。
13699 0
阿里云服务器如何登录?阿里云服务器的三种登录方法
购买阿里云ECS云服务器后如何登录?场景不同,阿里云优惠总结大概有三种登录方式: 登录到ECS云服务器控制台 在ECS云服务器控制台用户可以更改密码、更换系.
23788 0
阿里云ECS云服务器初始化设置教程方法
阿里云ECS云服务器初始化是指将云服务器系统恢复到最初状态的过程,阿里云的服务器初始化是通过更换系统盘来实现的,是免费的,阿里云百科网分享服务器初始化教程: 服务器初始化教程方法 本文的服务器初始化是指将ECS云服务器系统恢复到最初状态,服务器中的数据也会被清空,所以初始化之前一定要先备份好。
13998 0
赞!带进度条的 jQuery 文件拖放上传插件
  jQuery File Uploader 是一个 jQuery 文件拖放上传插件,包括 Ajax 上传和进度条效果。作者编写这个插件的想法是要保持它非常简单,不像其他的插件,很多的标记,并提供一些 Hack 的方式使之兼容那些古老的浏览器。
823 0
20+ 个很棒的 jQuery 文件上传插件或教程
文件上传是网站很常见的功能之一,通过使用 jQuery 可以让上传过程更加人性化,更好的用户体验。本文介绍20个jQuery的文件上传插件,其中有一些是教程。 1. Plupload Plupload 是一个Web浏览器上的界面友好的文件上传模块,可显示上传进度、图像自动缩略和上传分块。
2105 0
+关注
3546
文章
0
问答
文章排行榜
最热
最新
相关电子书
更多
OceanBase 入门到实战教程
立即下载
阿里云图数据库GDB,加速开启“图智”未来.ppt
立即下载
实时数仓Hologres技术实战一本通2.0版(下)
立即下载