BUI

其它版本:

API for BUI 1.4.8

Show:

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
       }) 

Item Index

Methods

add

(
  • [option]
)
chainable

添加文件, 参数的配置全部针对原生选择

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]
)
chainable

开始上传

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]
)
chainable

把选择的图片文件转换成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();