Uploader

稿件来源: 互联网   撰稿作者: 匿名   发表日期: 2015-03-23   阅读次数: 144   查看权限: 游客查看

Uploader模块管理网络上传,用于从本地上传各种文件到网络,支持跨域访问操作。通过plus.uploader可获取上传管理对象。

方法:

对象:

回调方法:

createUpload

新建上传任务

Upload plus.uploader.createUpload( url, option, completedCB );

说明:

请求上传管理创建新的上传任务。

参数:

返回值:

Upload对象

示例:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Uploader Example</title>
<script type="text/javascript" >
// 扩展API加载完毕后调用onPlusReady回调函数 
document.addEventListener( "plusready", onPlusReady, false );
var r = null; 
// 扩展API加载完毕,现在可以正常调用扩展API 
function onPlusReady() {
}
// 创建上传任务
function createUpload() {
	var task = plus.uploader.createUpload( "http://www.test.com/upload.do", 
		{ method:"POST",blocksize:204800,priority:100 },
		function ( t, status ) {
			// 上传完成
			if ( status == 200 ) { 
				alert( "Upload success: " + t.url );
			} else {
				alert( "Upload failed: " + status );
			}
		}
	);
	task.addFile( "_www/a.doc", {key:"testdoc"} );
	task.addData( "string_key", "string_value" );
	//task.addEventListener( "statechanged", onStateChanged, false );
	task.start();
}
</script>
</head>
<body >
	<input id="upload" type="button" value="Create upload task" onclick="createUpload();" ></input>
</body>
</html>

enumerate

枚举应用的所有上传任务

plus.uploader.enumerate( enumCB, state );

说明:

枚举指定状态的上传任务列表。枚举操作完成后通过enumCB回调返回结果。

参数:

返回值:

示例:

<!DOCTYPE html>
<html>
	<head>
	<meta charset="utf-8">
	<title>Uploader Example</title>
	<script type="text/javascript" >
// 扩展API加载完毕后调用onPlusReady回调函数 
document.addEventListener( "plusready", onPlusReady, false );
var r = null; 
// 扩展API加载完毕,现在可以正常调用扩展API 
function onPlusReady() {
	plus.uploader.enumerate( function ( tasks ) {
		alert( "Unfinished task count: " + tasks.length );
	} );
}
	</script>
	</head>
	<body >
		Enumerate all unfinished upload task.
	</body>
</html>

clear

清除上传任务

plus.uploader.clear( state );

说明:

清除指定状态的上传任务。

参数:

  • state (UploadState) 可选 默认值为所有已完成的上传任务。

返回值:

示例:

<!DOCTYPE html>
<html>
	<head>
	<meta charset="utf-8">
	<title>Uploader Example</title>
	<script type="text/javascript" >
// 扩展API加载完毕后调用onPlusReady回调函数 
document.addEventListener( "plusready", onPlusReady, false );
var r = null; 
// 扩展API加载完毕,现在可以正常调用扩展API 
function onPlusReady() {
	plus.uploader.clear();
}
	</script>
	</head>
	<body >
		Clear all finished upload task.
	</body>
</html>

startAll

开始所有上传任务

plus.uploader.startAll();

说明:

开始所有处于暂停状态的上传任务。若上传任务数超过可并发处理的总数,超出的任务处于调度状态(等待上传),当有任务完成时根据调度状态任务的优先级选择任务开始上传。

返回值:

示例:

<!DOCTYPE html>
<html>
	<head>
	<meta charset="utf-8">
	<title>Uploader Example</title>
	<script type="text/javascript" >
// 扩展API加载完毕后调用onPlusReady回调函数 
document.addEventListener( "plusready", onPlusReady, false );
var r = null; 
// 扩展API加载完毕,现在可以正常调用扩展API 
function onPlusReady() {
	plus.uploader.startAll();
}
	</script>
	</head>
	<body >
	Start upload task.
	</body>
</html>

Upload

Upload对象用于管理单个上传任务

方法:

属性:

  • url:DOMString,只读属性,上传任务的服务器地址,在创建任务时设置的值。
  • state:Number,只读属性,上传任务的状态,参考UploadState,在UploadCompleteCallback事件和UploadStateChangedCallback事件触发时更新。
  • options:UploadOption,只读属性,上传任务配置的参数,参考UploadOption。
  • responseText:DOMString,只读属性,上传任务完成后服务器返回的数据,在UploadCompleteCallback事件和UploadStateChangedCallback事件触发时更新。
  • uploadedSize:Number,只读属性,上传任务已完成上传文件的大小,在UploadCompleteCallback事件和UploadStateChangedCallback事件触发时更新。
  • totalSize:Number,只读属性,上传任务要上传文件的总大小,在UploadCompleteCallback事件和UploadStateChangedCallback事件触发时更新。

addFile

添加上传文件

Boolean upload.addFile( path, option );

说明:

向上传任务中添加文件,必须在任务开始上传前调用。若指定的key在任务中已经存在则会添加失败,返回false。若添加的文件路径不合法或指定文件不存在,则任务添加操作失败,返回false。若任务已经开始上传,再次调用则会操作失败。

参数:

返回值:

添加成功则返回true,添加失败则返回false。

示例:

<!DOCTYPE html>
<html>
	<head>
	<meta charset="utf-8">
	<title>Uploader Example</title>
	<script type="text/javascript" >
// 扩展API加载完毕后调用onPlusReady回调函数
document.addEventListener( "plusready", onPlusReady, false );
var r = null;
// 扩展API加载完毕,现在可以正常调用扩展API
function onPlusReady() {
}
// 创建上传任务
function createUpload() {
	var task = plus.uploader.createUpload( "http://www.test.com/upload.do", {}, function ( t, status ) {
		// 上传完成
		if ( status == 200 ) {
			alert( "Upload success: " + t.url );
		} else {
			alert( "Upload failed: " + status );
		}
	});
	task.addFile( "_www/a.doc", {key:"testdoc"} );
	task.addData( "string_key", "string_value" );
	//task.addEventListener( "statechanged", onStateChanged, false );
	task.start();
}
	</script>
	</head>
	<body >
	<input id="upload" type="button" value="Create upload task" onclick="createUpload();" ></input>
	</body>
</html>

addData

添加上传数据

Boolean upload.addData( key, value );

说明:

向上传任务中添加数据,必须在任务开始上传前调用。若指定的key在任务中已经存在则会添加失败,返回false。若任务已经开始上传,再次调用则会操作失败。

参数:

  • key (DOMString) 可选 要添加上传数据的键名
  • value (DOMString) 可选 要添加上传数据的键值

返回值:

添加成功则返回true,添加失败则返回false。

示例:

<!DOCTYPE html>
<html>
	<head>
	<meta charset="utf-8">
	<title>Uploader Example</title>
	<script type="text/javascript" >
// 扩展API加载完毕后调用onPlusReady回调函数
document.addEventListener( "plusready", onPlusReady, false );
	var r = null;
	// 扩展API加载完毕,现在可以正常调用扩展API
	function onPlusReady() {
}
// 创建上传任务
function createUpload() {
	var task = plus.uploader.createUpload( "http://www.test.com/upload.do", {}, function ( t, status ) {
		// 上传完成
		if ( status == 200 ) {
			alert( "Upload success: " + t.url );
		} else {
			alert( "Upload failed: " + status );
		}
	});
	task.addFile( "_www/a.doc", {key:"testdoc"} );
	task.addData( "string_key", "string_value" );
	//task.addEventListener( "statechanged", onStateChanged, false );
	task.start();
}
	</script>
	</head>
	<body >
	<input id="upload" type="button" value="Create upload task" onclick="createUpload();" ></input>
	</body>
</html>

start

开始上传任务

upload.start();

说明:

开始上传任务,如果任务已经处于开始状态则无任何响应。通常在创建任务或任务失败后重新开始。

返回值:

示例:

<!DOCTYPE html>
<html>
	<head>
	<meta charset="utf-8">
	<title>Uploader Example</title>
	<script type="text/javascript" >
// 扩展API加载完毕后调用onPlusReady回调函数 
document.addEventListener( "plusready", onPlusReady, false );
var r = null; 
// 扩展API加载完毕,现在可以正常调用扩展API 
function onPlusReady() {
}
// 创建上传任务
function createUpload() {
	var task = plus.uploader.createUpload( "http://www.test.com/upload.do", {}, function ( t, status ) {
	// 上传完成
	if ( status == 200 ) {
		alert( "Upload success: " + t.url );
	} else {
		alert( "Upload failed: " + status );
	}
	});
	task.addFile( "_www/a.doc", {key:"testdoc"} );
	task.addData( "string_key", "string_value" );
	//task.addEventListener( "statechanged", onStateChanged, false );
	task.start();
}
	</script>
	</head>
	<body >
	<input id="upload" type="button" value="Create upload task" onclick="createUpload();" ></input>
	</body>
</html>

pause

停止上传任务

upload.pause();

说明:

停止上传任务,如果任务已经处于初始状态或暂停状态则无任何响应。通常在任务已开始后暂停任务。

返回值:

示例:

<!DOCTYPE html>
<html>
	<head>
	<meta charset="utf-8">
	<title>Uploader Example</title>
	<script type="text/javascript" >
// 扩展API加载完毕后调用onPlusReady回调函数 
document.addEventListener( "plusready", onPlusReady, false );
var task = null;
// 扩展API加载完毕,现在可以正常调用扩展API 
function onPlusReady() {
}
// 创建上传任务
function createUpload() {
	var task = plus.uploader.createUpload( "http://www.test.com/upload.do", {}, function ( t, status ) {
		// 上传完成
		if ( status == 200 ) {
			alert( "Upload success: " + t.url );
		} else {
			alert( "Upload failed: " + status );
		}
	});
	task.addFile( "_www/a.doc", {key:"testdoc"} );
	task.addData( "string_key", "string_value" );
	//task.addEventListener( "statechanged", onStateChanged, false );
	task.start();
}
// 暂停上传任务
function pauseUpload() {
	task.pause();
}
	</script>
	</head>
	<body >
	<input type="button" value="Create upload task" onclick="createUpload();" ></input>
	<input type="button" value="Pause upload task" onclick="pauseUpload();" ></input>
	</body>
</html>

resume

恢复上传任务

upload.resume();

说明:

恢复上传任务,当任务暂停后调用此方法继续上传操作。当任务不处于暂停状态,调用此方法将无任何作用。

返回值:

示例:

<!DOCTYPE html>
<html>
	<head>
	<meta charset="utf-8">
	<title>Uploader Example</title>
	<script type="text/javascript" >
// 扩展API加载完毕后调用onPlusReady回调函数
document.addEventListener( "plusready", onPlusReady, false );
var task = null;
// 扩展API加载完毕,现在可以正常调用扩展API
function onPlusReady() {
}
// 创建上传任务
function createUpload() {
	var task = plus.uploader.createUpload( "http://www.test.com/upload.do", {}, function ( t, status ) {
		// 上传完成
		if ( status == 200 ) {
			alert( "Upload success: " + t.url );
		} else {
			alert( "Upload failed: " + status );
		}
	});
	task.addFile( "_www/a.doc", {key:"testdoc"} );
	task.addData( "string_key", "string_value" );
	//task.addEventListener( "statechanged", onStateChanged, false );
	task.start();
}
// 暂停上传任务
function pauseUpload() {
	task.pause();
}
// 恢复上传任务
function resumeUpload() {
	task.resume();
}
	</script>
	</head>
	<body >
		<input type="button" value="Create upload task" onclick="createUpload();" ></input>
		<input type="button" value="Pause upload task" onclick="pauseUpload();" ></input>
		<input type="button" value="Resume upload task" onclick="resumeUpload();" ></input>
	</body>
</html>

abort

取消上传任务

upload.abort();

说明:

取消上传任务,如果任务已经取消则无任何响应。如果任务未完成,将删除已上传的临时文件。如果任务已完成,将不删除已上传的文件。

返回值:

示例:

<!DOCTYPE html>
<html>
	<head>
	<meta charset="utf-8">
	<title>Uploader Example</title>
	<script type="text/javascript" >
// 扩展API加载完毕后调用onPlusReady回调函数 
document.addEventListener( "plusready", onPlusReady, false );
var task = null;
// 扩展API加载完毕,现在可以正常调用扩展API 
function onPlusReady() {
}
// 创建上传任务
function createUpload() {
	var task = plus.uploader.createUpload( "http://www.test.com/upload.do", {}, function ( t, status ) {
		// 上传完成
		if ( status == 200 ) {
			alert( "Upload success: " + t.url );
		} else {
			alert( "Upload failed: " + status );
		}
	});
	task.addFile( "_www/a.doc", {key:"testdoc"} );
	task.addData( "string_key", "string_value" );
	//task.addEventListener( "statechanged", onStateChanged, false );
	task.start();
}
// 暂停上传任务
function pauseUpload() {
	task.pause();
}
// 取消上传任务
function abortUpload() {
	task.pause();
}
	</script>
	</head>
	<body >
	<input type="button" value="Create upload task" onclick="createUpload();" ></input>
	<input type="button" value="Pause upload task" onclick="pauseUpload();" ></input>
	<input type="button" value="Abort upload task" onclick="abortUpload();" ></input>
	</body>
</html>

addEventListener

添加上传任务事件监听器

upload.addEventListener( type, listener, capture );

说明:

上传任务添加事件监听器后,当任务事件发生时触发。

参数:

  • type (DOMString) 可选 事件类型
  • listener (DOMString) 可选 事件监听器回调函数
  • capture (Boolean) 可选 事件流处理顺序,暂不支持

返回值:

示例:

<!DOCTYPE html>
<html>
	<head>
	<meta charset="utf-8">
	<title>Uploader Example</title>
	<script type="text/javascript" >
// 扩展API加载完毕后调用onPlusReady回调函数 
document.addEventListener( "plusready", onPlusReady, false );
var task = null;
// 扩展API加载完毕,现在可以正常调用扩展API 
function onPlusReady() {
}
// 监听上传任务状态
function onStateChanged( upload, status ) {
	if ( upload.state == 4 && status == 200 ) {
		// 上传完成
		alert( "Upload success: " + upload.getFileName() );
	}
}
// 创建上传任务
function createUpload() {
	var task = plus.uploader.createUpload( "http://www.test.com/upload.do" );
	task.addFile( "_www/a.doc", {key:"testdoc"} );
	task.addData( "string_key", "string_value" );
	task.addEventListener( "statechanged", onStateChanged, false );
	task.start();
}
// 暂停上传任务
function pauseUpload() {
	task.pause();
}
// 取消上传任务
function abortUpload() {
	task.pause();
}
	</script>
	</head>
	<body >
		<input type="button" value="Create upload task" onclick="createUpload();" ></input>
		<input type="button" value="Pause upload task" onclick="pauseUpload();" ></input>
		<input type="button" value="Abort upload task" onclick="abortUpload();" ></input>
	</body>
</html>

UploadState

上传任务的状态,Number类型

属性:

  • 0:number,初始状态,在创建之后触发此状态事件,上传任务处于可调度状态
  • 1:number,上传任务开始处理,开始建立网络连接
  • 2:number,上传任务请求已经接收,网络连接已建立
  • 3:number,上传任务请求处理中,上传过程中不断触发
  • 4:number,上传任务已完成(成功或失败)
  • 5:number,上传任务暂停状态,可重新开始
  • -1:number,非任务状态,用于enumerate()和claer()操作所有上传任务

UploadOption

JSON对象,创建上传任务的参数

属性:

  • method:DOMString,网络请求类型,必须是http协议的“POST”
  • blocksize:number,上传任务每次上传的文件块大小(仅在支持断点续传的服务有效),单位为字节,默认值为102400,若设置值小于等于0则表示不分块上传
  • priority:number,上传任务的优先级,数值越大优先级越高
  • timeout:number,上传任务超时时间,单位为s,默认为120s
  • retry:number,上传任务重试次数,默认为3次

UploadFileOption

JSON对象,创建上传文件选项的参数

属性:

  • key:DOMString,不设置则自动取文件名称,一个上传任务中如果添加相同key的上传字段将导致添加失败。
  • name:DOMString,不设置则自动取本地文件名称。
  • mime:DOMString,不设置则自动根据文件后缀名称生成。

UploadCompletedCallback

上传任务完成时的回调函数

void uploadCompleted( Upload upload, Number status ) {
	// File upload completed code.
}

说明:

在上传任务完成时调用,上传任务失败也将触发此回调。

参数:

  • upload (Upload) 可选 上传任务对象
  • status (Number) 可选 如果未获取传输状态则其值则为0,如上传成功其值通常为200。

UploadStateChangedCallback

上传任务状态变化回调函数,在上传任务状态发生变化时调用

void onStateChanged( Upload upload, status ) {
	// Upload state changed code.
}

说明:

上传任务状态变化回调函数,在上传任务状态发生变化时调用

参数:

  • upload (Upload) 可选 上传任务对象
  • status (Number) 可选 如果未获取传输状态则其值则为0,如上传成功其值通常为200。

UploadEnumerateCallback

枚举上传任务回调函数,在枚举上传任务完成时时调用

void onEnumerated( Upload[] uploads ) {
	// Upload enumerate completed code.
}

说明:

枚举上传任务回调函数,在枚举上传任务完成时时调用

参数:

  • uploads (Upload) 可选 枚举到的上传任务对象数组

关键词: html5puls,Uploader   编辑时间: 2015-03-23 23:25:18

  • 感到高兴

    0

    高兴
  • 感到支持

    0

    支持
  • 感到搞笑

    0

    搞笑
  • 感到不解

    0

    不解
  • 感到谎言

    0

    谎言
  • 感到枪稿

    0

    枪稿
  • 感到震惊

    0

    震惊
  • 感到无奈

    0

    无奈
  • 感到无聊

    0

    无聊
  • 感到反对

    0

    反对
  • 感到愤怒

    0

    愤怒
0%(0)
0%(0)
上一篇:Storage
下一篇:Webview
共有0 条评论 发言请遵守【相关规定

网友评论

会员头像
发 表同步腾讯微博    验证码:  点击更新请先登陆
  • 暂无评论
关闭模块文章图片 article Pictrue
  • 我的妈妈爸爸
  • 基于koa2+mysql+vue2.0+Element阳光内容管理系统
  • 代码覆盖率工具 Istanbul 入门教程
  • 全栈工程师的武器——MEAN
  • 9款超炫的 CSS3 复选框(Checkbox)
  • 微信开发在线翻译功能
  • CSS3那些不为人知的高级属性
  • 给easyui的datebox添加清空事件
  • flash写字效果
  • kendoUI系列教程之DropDownList下拉菜单
  • kendoUI系列教程之datetimepicker日期时间选择
  • kendoUI系列教程之datepicker日期选择
  • kendoUI系列教程之combobox下拉列表框
  • kendoUI系列教程之colorpicker
  • kendoUI系列教程之calendar日历表
  • kendoUI系列教程之autocomplete自动补齐