上传插件

github.com/viyongyong/jquery-kk-upload

代码示例

图片上传用法
图片上传可预览 

  var config = {
    KUPLOAD_MAGE_PATH: '/libs/jquery-kk-upload/',
    upload: {
      authorization: 'http://local.qmr.com/folder/oss',
      file_uploaded_callback: fileUploadedCallback,
      upload_complete_callback: uploadCompleteCallback
    },
    show: {
      list_width: '100px',
      list_height: '100px'
    },
    file_input: 'images'
  };
  var images = [
    {
      url: 'http://assets.viyongyong.com/images/2018/09/07/23k2h0R8S7.png',
      name: 'F851C8j3r6S0a4D4C5Z6.jpg'
    },
    {
      url: 'http://assets.viyongyong.com/images/2018/08/15/a3D2G6S6B1.png',
      name: 'p2C3n1p770.jpg'
    }
  ];
  ku = $('#images').createUploadLayer(config, images);
文件上传用法
文件上传列表形式 

  var config = {
    KUPLOAD_MAGE_PATH: '/libs/jquery-kk-upload/',
    upload: {
      now_upload: false,
      post_type: 'now',
      url: '/php/upload.php',
      file_uploaded_callback: fileUploadedCallback,
      upload_complete_callback: uploadCompleteCallback
    },
    show: {
      item_show: 'ico',
      ico_width: '100%'
    },
    file_input: 'file'
  };
  var files = [
    {
      url: 'http://assets.viyongyong.com/images/2018/09/07/23k2h0R8S7.png',
      name: 'F851C8j3r6S0a4D4C5Z6.jpg'
    },
    {
      url: 'http://assets.viyongyong.com/images/2018/08/15/p2C3n1p770.jpg',
      name: 'p2C3n1p770.jpg'
    }
  ];
  var ku2 = $('#file').createUploadLayer(config, files);

插件使用

配置

属性 说明 类型 默认值
KUPLOAD_MAGE_PATH 插件路径，取项目根部路径 String /jquery-kk-upload/
KUPLOAD_MAGE_VERSION 插件版本（可忽略） String -
libs 插件扩展 Object {}
upload (上传)
now_upload 选中文件是否立刻上传 Boolean true
num_max 最高上传数量 Number 10
post_type 上传方式 (upload/oss) Enumeration oss
file_type 上传文件类型 (image/file) Enumeration image
extensions 上传文件扩展名 多个','隔开 String jpg,jpeg,gif,png,bmp
url 上传地址 (post_type = upload 必填) String -
authorization oss授权地址 (post_type = oss 必填) String -
file_uploaded_callback 上传单个成功回调函数 Function null
upload_complete_callback 本次全部文件成功回调函数 Function null
show (显示)
item_show 显示方式 (ico: 图标, list: 图片预览) Enumeration list
list_width list宽度 String 150px
list_height list高度 String 150px
ico_width 图标宽度 String 450px
is_sort 是否支持排序 Boolean true
file_input 上传文件表单名称 String -
max_file_size 文件上传限制参数 String 10mb

事件

事件名 说明 返回值
createUploadLayer 创建上传层 自己
imagesInit 图片初始化 无
getFiles 得到所有文件 Object
getFileNum 得到控件文件数量 Number