bui.upload Class
单文件上传,支持webapp跟安卓,ios,依赖于fileselect控件
预览地址: demo
选择,上传图片,只支持单个文件上传
add: 添加文件remove: 移除添加的文件
clear: 清除所有添加的文件
data: 获取添加的数据
start: 上传文件
stop: 停止上传
toBase64: 把路径转换成base64位图片地址
widget: 获取依赖的控件
Constructor
bui.upload
-
[option]
Parameters:
-
[option]
Object optional-
[url]
String optional[ 上传的地址 ]
-
[data]
Object optional[ 要上传的对象, data初始化的时候有值会直接上传, 使用 h5 的formdata 上传 ]
-
[fileKey]
String optional[ 默认: file , 后端需要接收这个字段进行保存 ]
-
[timeout]
Number optional[ 触发timeout的时间默认60000 ]
-
[mediaType]
String optional[ 1.4.7新增, 文件的类型, 原生只支持图片上传,webapp部分机型不支持 默认: picture | allmedia | video | audio ]
-
[from]
String optional[ 1.4.7新增, 默认 "" 从相册选 | "camera" 相机拍照 | "camcorder" 录像, 需要配合 mediaType 参数 ]
-
[showProgress]
Boolean optional[ 是否显示进度条 默认true ]
-
[native]
Boolean optional[ 默认true 由debug状态决定 false则强制采用web方式 ]
-
[onProgress]
Function optional[ 自定义进度条回调,接收百分比值 ]
-
[onSuccess]
Function optional[ 成功的回调 ]
-
[onFail]
Function optional[ 失败的回调 ]
-
Example:
js:
// 1. 初始化 这里如果传url初始化,则url作为公共上传地址,start不再需要传url
var uiUpload = bui.upload({
url: "http://"
});
// 2. 选择文件
uiUpload.add({
onSuccess: function(file){
// console.log(this)
// 3. 上传文件 选择以后直接上传到服务器
uiUpload.start({
onSuccess:function(data){
// 成功
},
onFail: function(res,status){
// 失败 status = "timeout" || "error" || "abort", "parsererror"
}
});
}
})
// 3. 也可以选择后再单独上传
uiUpload.start({
data: null
})
Methods
add
-
[option]
添加文件, 参数的配置全部针对原生选择
Parameters:
-
[option]
Object optional[图片质量,默认40]
-
[quality]
Number optional[图片质量,默认40]
-
[width]
Number optional[图片宽度,默认800, targetWidth和targetHeight设置为undefined 则添加原图]
-
[height]
Number optional[图片高度,默认800, targetWidth和targetHeight设置为undefined 则添加原图]
-
[from]
String optional[ 图片来源, 默认来自 photo(相册) | camera(相机) | savephoto(来自保存的相册) ]
-
[destinationType]
String optional[ file (返回路径值) | data (返回base64位值) ]
-
[onSuccess]
Function optional[ 成功的回调 ]
-
[onFail]
Function optional[ 失败的回调 ]
-
Example:
uiUpload.add({
onSuccess: function(file){
// console.log(this)
}
})
clear
()
chainable
清空所有选择的文件
Example:
uiUpload.clear();
data
()
获取所有选择的文件, 原生默认只返回最后一个选择的文件
Example:
var data = uiUpload.data();
// 返回 [{ name: "base64.jpg", data: null, type: "jpg" }]
// 其中 data为要上传的文件值
remove
()
chainable
删除最后选择的文件
Example:
uiUpload.remove();
start
-
[option]
开始上传
Parameters:
-
[option]
Object optional[参数同初始化一样,在初始化时配置,则是公共的, data不传则获取最后一次选择]
Example:
uiUpload.start({
data: null,
onSuccess: function (res) {
// 成功
},
onFail: function (res,status) {
// 失败 status = "timeout" || "error" || "abort", "parsererror"
}
})
stop
()
chainable
停止上传
Example:
uiUpload.stop()
toBase64
-
[option]
把选择的图片文件转换成base64地址,可以直接展示在页面上
Parameters:
-
[option]
Object optional[]
-
[data]
String optional[ 通过文件选择的返回值,如果不传data,值来自于通过add添加的最后一个文件 ]
-
[onSuccess]
Function optional[成功的回调]
-
[onFail]
Function optional[失败的回调]
-
Example:
uiUpload.toBase64({
onSuccess: function (imgurl) {
$("#id").append('<img src="'+imgurl+'" />')
}
});
widget
-
[name]
获取依赖的控件
Parameters:
-
[name]
String optional[ 依赖控件名 loading ]
Example:
//获取依赖控件
var uiLoading = uiUpload.widget("loading");
//使用uiLoading的方法
uiLoading.start();