文章目录
-
- 方法列表：
- 属性集合：
- 事件集合:（up为uploader缩写）
- 实例:
方法列表：
Uploader(setting)：创建实例的构造方法
var uploader = new plupload.Uploader({
runtimes : 'gears,html5,flash',browse_button : 'button_id'
});bind(event, function[, scope])：绑定事件
uploader.bind('Init', function(up) {
alert('Supports drag/drop: ' + (!!up.features.dragdrop));
});destroy()：销毁plupload的实例对象uploader.destroy()getFile(id): 获取上传文件信息
uploader.bind('FilesAdded', function(up, files) {
for (var i in files) {
up.getFile(files[i].id);
}});
<span style="color: #ff0000; font-size: 13px;"> </span>
注：
file：{
id:文件编号,loaded: 已经上传多少字节,name: 文件名,percent: 上传进度,size: 文件大小,status: 有四种状态 QUEUED, UPLOADING, FAILED, DONE.对应数值
}init:初始化plupload实例，添加监听对象uploader.destroy()refresh：重新实例化uploaderremoveFile(id):从file中移除某个文件splice(start,length)：从队列中start开始删除length个文件， 返回被删除的文件列表start() 开始上传stop()停止上传unbind(name, function): 接触事件绑定unbindAll()解绑所有事件
属性集合：
features：uploader中包含那些特性files:当前队列中的文件列表id：uploader实例的唯一idruntime：当前运行环境（是html5、flash等等)state:当前上传进度状态total：当前上传文件的信息集合事件集合:（up为uploader缩写）
BeforeUpload(up, file)：文件上传完之前触发的事件ChunkUploaded(up, file,response)文件被分块上传的事件Destroy(up):uploader的destroy调用的方法Error(up, err)：上传出错的时候触发Fileadded(up, files):用户选择文件时触发FileRemoved(up, files):当文件从上传队列中移除触发FileUploaded(up, file, res):文件上传成功的时候触发Init(up):当初始化的时候触发PostInit(up):init执行完以后要执行的事件触发QueueChanged(up):当文件队列变化时触发Refresh(up):当silverlight/flash或是其他运行环境需要移动的时候触发StateChanged(up)当整个上传队列被改变的时候触发UploadComplete(up,file)当队列中所有文件被上传完时触发UploadFile(up,file)当一个文件被上传的时候触发UploadProgress(up,file):当文件正在被上传中触发
实例:
// 创建上传对象
createUpLoader: function () {
// 绑定上传按钮var config = {
//省略context: xx,url: "",init:{
}},//实例化一个上传对象并加载配置//new plupload.Uploader(config);this.upLoader = new plupload.Uploader(config);//初始化this.upLoader.init();//开启事件的监控:this.filesAdded //不要写成this.filesAdded(),使用赋值的样式,不是调用方法的样式this.upLoader.bind('filesAdded', this.filesAdded);//一定要注意this的范围,我在uploadComplete中使用了this.createUpLoader();//这个this本来是要指向createUpLoader的,但是如果我是在这里用了upLoader去调这个函数//那this.createUpLoader();的this外层就是upLoader,不是我想要的那个this范围了//所以用了bind(this),转化this的作用域,所以最好都加上.bind(this),不然就直接写在init里面//因为你把函数分开写,好看了,但是this的作用域已经改变了// this.upLoader.bind('uploadComplete', this.uploadComplete);this.upLoader.bind('uploadComplete', this.uploadComplete.bind(this));
}filesAdded: function (up, files) {
console.log("入列");// 重置上传状态// 刷新文件夹名称up.start(); // 启动上传
},uploadComplete: function (up, files) {
this.createUpLoader();
},
改成写在init中:方式一:推荐,好处就是可以把函数分开写在外边
createUpLoader: function () {
init: {
FilesAdded: this.filesAdded.bind(this), // 入列后BeforeUpload: this.beforeUpload.bind(this), // 上传前FileUploaded: this.fileUploaded.bind(this),UploadComplete: this.uploadComplete.bind(this),}
}
filesAdded: function (up, files) {
console.log("入列");// 重置上传状态// 刷新文件夹名称up.start(); // 启动上传
},uploadComplete: function (up, files) {
this.createUpLoader();
},
方式二:函数写在里边,函数太长了就不好看了
createUpLoader: function () {
init: {
FilesAdded: function (up, files) {
this.createUpLoader();}, // 入列后UploadComplete: function (up, files) {
this.createUpLoader();},}
}