Uploadifyuploadifive上传(中⽂⽂档)
Uploadify是⼀款基于JQuery的优秀的⽂件/图⽚上传的插件,有基于Flash和HTML5两种版本。
Uploadify/uploadifive主要特点有:
1. 多⽂件上传
2. 个性化设置
3. 上传进度条显⽰
4. 拖拽上传(HTML5版本)
部署
在部署⼀个Uploadify实例前,请确保满⾜最低要求:
1.jQuery 1.4.x 或更⾼版本
2.Flash Player 9.0.24 或更⾼版本
3.⽀持PHP, ASP.Net, Cold Fusion的服务器环境(官⽅默认⽀持PHP)
,解压到服务器根⽬录下的uploadify⽂件夹中,你可以看到以下⽂件:
(uploadify的升级⽇志,部署时删掉)
check-exists.php(⽤来检查上传⽬标⽂件夹⾥是否存在相同⽂件)
index.php(官⽅实例)
jquery.uploadify.js(上传插件)
jquery.uploadify.min.js(压缩版的上传插件,部署时使⽤)
<(许可证⽂件,部署时删掉)
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" src="/uploadify/jquery.min.js"></script>
3.引⽤uploadify脚本
1. <script type="text/javascript" src="/uploadify /jquery.uploadify.min.js"></script>
4.引⽤uploadify样式表
1. <link rel="stylesheet" type="text/css" href="uploadify.css" />
5. 声明⼀个普通的html⽂件上传控件,并指定id
1. <input id="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. });
8. });
9. </script>
属性
布尔型
设置auto为true,当⽂件被添加⾄上传队列时,将会⾃动上传。
字符串
为上传按钮添加类名。
字符串
⿏标经过上传按钮时,⿏标的形状。可选值为‘hand’(⼿形) 和 ‘arrow’(箭头)。
字符串
定义“浏览”按钮背景图像的路径。给按钮设置背景图像的代码最好写在CSS⽂件中。字符串
定义显⽰在默认按钮上的⽂本。
字符串
定义检查⽬标⽂件夹中是否存在同名⽂件的脚本⽂件路径。
布尔型
当其值为true时,开启SWFUpload调试模式。
字符串
定义上传数据处理⽂件中接收数据使⽤的⽂件对象名。
整型
上传⽂件⼤⼩限制。
字符串
可选择的⽂件类型的描述。此字符串出现在浏览⽂件对话框的⽂件类型下拉菜单中。字符串
定义允许上传的⽂件后缀。
JSON对象
定义在⽂件上传时需要⼀同提交的其他数据对象。
整型jquery官方文档下载
上传按钮的⾼度(单位:像素)。
布尔型
itemTemplate选项允许你为每⼀个添加到队列中选项设定⼀个不同HTML模板。
字符串
上传⽂件的提交⽅法,取值‘post‘或‘get‘。
布尔型
设置值为false时,⼀次只能选中⼀个⽂件。
JSON
该项定义了⼀组默认脚本中你不想执⾏的事件名称。
布尔型
如果设置为真,⼀个随机的值添加到SWF⽂件的URL,因此它不会缓存。
字符串
设置显⽰在上传进度条中的数据类型,可选项时百分⽐(percentage)或速度(speed)。
字符串
queueID选项允许你设置⼀个拥有唯⼀ID的DOM元素来作为显⽰上传队列的容器。
整型
上传队列中⼀次可容纳的最⼤条数。
布尔型
不设置该选项或者将其设置为false,将使上传队列中的项⽬始终显⽰于队列中,直到点击了关闭按钮或者队列被清空。
整型
设置上传完成后从上传队列中移除的时间(单位:秒)。
布尔型
设置为真时,上传队列重置或上传多次重试时,返回错误信息。
整型
表⽰uploadify的成功等待时间(单位:秒,默认30秒)。
字符串
定义uploadify.swf的路径。
字符串
定义服务器端上传数据处理脚本⽂件uploadify.swf的路径。
整型
定义允许的最⼤上传数量。
整型
定义浏览按钮的宽度。
事件
函数
设置onCancel选项,在⽂件上传被取消时,将允许运⾏⼀个⾃定义函数。
函数
设置onClearQueue选项,上传队列清空(激活ancel⽅法)时,将允许运⾏⼀个⾃定义函数。
函数
销毁Uploadify实例(调⽤destroy⽅法)时触发该事件。
函数
当浏览⽂件对话框关闭时触发该事件。如果该事件被添加到overrideEvents属性中,在添加⽂件到队列中发⽣错误时,将不会弹出默认错误信息。
函数
在浏览⽂件对话框被打开前⼀瞬触发该事件。
函数
调⽤disable⽅法禁⽤Uploadify实例时触发该事件。
函数
调⽤disable⽅法启⽤Uploadify实例时触发该事件。
函数
浏览器检测不到兼容版本的Flash时触发该事件。
函数
调⽤Uploadify初始化结束时触发该事件。
函数
队列中的所有⽂件被处理完成时触发该事件。
函数
每添加⼀个⽂件⾄上传队列时触发该事件。
函数
选择⽂件返回错误时触发该事件。每⼀个⽂件返回错误都会触发该事件。函数
当flash按钮载⼊完毕时触发该事件。
函数
每⼀个⽂件上传完成都会触发该事件,不管是上传成功还是上传失败。函数
上传失败时触发该事件。
函数
上传进度更新时触发该事件。
函数
在开始上传之前的瞬间会触发该事件。
函数
每⼀个⽂件上传成功时触发该事件。
⽅法
取消上传对象。
销毁Uploadify实例,并返回原⽂件域。
控制浏览按钮是否可⽤。
返回或更新⼀个Uploadify实例的值。
停⽌当前上传。
上传指定⽂件或队列中的所有⽂件。
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论