CmsTop内置了一个FLASH上传解决方案，通过该插件可以方便地上传单个或多个文件，并支持各种回调数据。
§ 文件
public/admin/uploader/cmstop.uploader.js
§ 原型
<jQuery> $(selector).uploader({
script: '',
scriptData:'',
fileDataName:'Filedata',
fileExt:'',
fileDesc:'',
buttonImg:'',
multi:true,
queueSizeLimit:0,
sizeLimit:0,
start:function(){},
select:function(){},
selectend:function(){},
queuefull:function(){},
open:function(){},
progress:function(){},
complete:function(){},
allcomplete:function(){},
error:function(){},
cancel:function(){},
clear:function(){},
});
§ 参数说明
|
参数 |
类型 |
描述 |
|
script |
string |
上传文件服务器端接收地址 |
|
scriptData |
string |
用来增加额外参数。 例如： index.php?id=1&action=uploader可以设置成：'script': 'index.php', 'scriptData': {'id':1,'action':'uploader'} |
|
fileDataName |
string |
您的文件在上传服务器脚本阵列的名称, 默认值='Filedata' |
|
fileExt |
string |
允许的文件后缀，以分号分隔，如：'*.jpg;*.gif;' |
|
fileDesc |
string |
出现在上传对话框中的文件类型描述。与fileExt需同时使用 |
|
buttonImg |
string |
上传按钮显示的图片 |
|
multi |
boolean |
设置上传模式，是单个上传还是批量上传，默认为批量上传 |
|
queueSizeLimit |
int |
队列文件数限制，一次可以上传多少个文件，默认不限制 |
|
sizeLimit |
int |
控制上传文件的大小，单位byte |
|
start |
function |
在初始化时执行,做一些初始化的工作 |
|
select |
function |
选择文件时触发，该函数有三个参数 event:事件对象。 queueID：文件的唯一标识，由6为随机字符组成。 fileObj：选择的文件对象，有name、size、creationDate、modificationDate、type 5个属性。 |
|
selectend |
function |
在文件选择结束点击确定时执行，该函数有三个参数 该函数有event、queueId、fileObj三个参数，参数的解释同上 |
|
queuefull |
function |
当设置了queueSizeLimit并且选择的文件个数超出了queueSizeLimit的值时触发。该函数有两个参数event和queueSizeLimit |
|
open |
function |
点击上传时触发，如果auto设置为true则是选择文件时触发，如果有多个文件上传则遍历整个文件队列。该函数有event、queueId、fileObj三个参数，参数的解释同上 |
|
progress |
function |
点击上传时触发，如果auto设置为true则是选择文件时触发，如果有多个文件上传则遍历整个文件队列，在open之后触发。该函数有event、queueId、fileObj、data四个参数，前三个参数的解释同上。data对象有四个属性percentage、bytesLoaded、allBytesLoaded、speed：percentage：当前完成的百分比 bytesLoaded：当前上传的大小 allBytesLoaded：文件队列中已经上传完的大小 speed：上传速率 kb/s |
|
complete |
function |
文件上传完成后触发。该函数有四个参数event、queueId、fileObj、response、data五个参数，前三个参数同上。response为后台处理程序返回的值，在上面的例子中为1或0，data有两个属性fileCount和speed，fileCount：剩余没有上传完成的文件的个数。 speed：文件上传的平均速率 kb/s |
|
allcomplete |
function |
文件队列中所有的文件上传完成后触发。该函数有event和data两个参数，data有四个属性，分别为：filesUploaded :上传的所有文件个数。 errors ：出现错误的个数。 allBytesLoaded ：所有上传文件的总大小。 speed ：平均上传速率 kb/s |
|
error |
function |
当上传过程中发生错误时触发。该函数有event、queueId、fileObj、errorObj四个参数，其中前三个参数同上，errorObj对象有type和info两个属性。type：错误的类型，有三种‘HTTP’, ‘IO’, or ‘Security’ info：错误的描述 |
|
cancel |
function |
当点击文件队列中文件的关闭按钮或点击取消上传时触发。该函数有event、queueId、fileObj、data四个参数，前三个参数同select 中的三个参数，data对象有两个属性fileCount和allBytesTotal。 |
|
clear |
function |
有event和data两个参数，同cancel 中的两个对应参数 |
§ 举例说明
<!-- 引入flash上传框架-->
<script type="text/javascript" src="uploader/cmstop.uploader.js"></script>
<!--使用Jquery给uploader绑定上传事件-->
<script type="text/javascript">
$(function(){
$("#uploader").uploader({
script : '?app=test&controller=index&action=upload', //上传文件接收地址
fileDataName : 'picdata', //表单上传图片字段名
fileDesc : '图片', //文件描述
fileExt : '*.jpg;*.gif;*.png;', //允许的文件后缀
buttonImg :'images/multiup.gif', //上传按钮显示的图片
sizeLimit : 10485760, //允许上传的图片尺寸，10M，以byte为单位
multi:false, //是否同时上传多图
complete:function(response,data){ //上传成功的回调函数
response =(new Function("","return "+response))();
if(response.state) {
ed || (ed = tinyMCE.get('content'));
ed.execCommand('mceInsertContent', false, response.code);
ct.ok(response.msg);
} else {
ct.error(response.msg);
}
}
});
});
</script>
<!--在HTML中写一个uploader按钮-->
<div id="uploader" class="uploader"></div>
