文件or图片上传方法封装

function UploadFile(options) {
    this.init(options)
}
UploadFile.prototype = {
    constructor: UploadFile,
    init: function(options) {
        if (options.domain) {
            document.domain = options.domain;
        }
        this.container = options.container ? document.querySelector(options.container) : document.body;
        this.iframe = document.createElement('iframe');
        let now = Date.now();
        let iframename = "iframe-" + now;
        this.iframe.id = iframename;
        this.iframe.name = iframename;
        this.iframe.style.display = 'none';
        if (this.iframe.contentWindow) {
            this.iframe.contentWindow.name = iframename;
        }

        this.container.appendChild(this.iframe);

        // 创建form
        this.form = document.createElement('form');
        this.form.method = 'post';
        this.form.action = options.url;
        this.form.encoding = 'multipart/form-data';
        this.form.name = 'form-' + now;
        this.form.target = iframeName;
        this.container.appendChild(this.form);

        //创建隐藏表单
        this.input = document.createElement('input');
        this.input.name = 'input-' + now;
        this.input.type = 'file';
        this.input.value = '';
        this.input.setAttribute('hideFocus', 'true');
        // input.accept = 'image/*';
        if (options.accept) {
            this.input.accept = options.accept;
        }
        this.form.appendChild(this.input);

        if (!options.noPosition) {
            this.fixedPosition();
        }
        var _this = this;
        // 上传中
        this.input.onchange = function() {
            if (!_this.input.files || !_this.input.files.length) {
                return;
            }
            _this.form.submit();
            if (options.onUploading) {
                options.onUploading();
            }
        }

        window[options.callback] = function(res) {
            if (options.onComplete) {
                options.onComplete(res);
            }
        }
    },
    fixedPosition: function() {
        var formStyle = this.form.style;
        formStyle.width = '100%';
        formStyle.height = '100%';
        formStyle.position = 'absolute';
        formStyle.left = '0';
        formStyle.top = '0';
        formStyle.opacity = '0';
        formStyle.filter = 'alpha(opacity=0)';
        var inputStyle = this.input.style;
        inputStyle.width = '100%';
        inputStyle.height = '100%';
    }
}

// Demo
// new UploadFile({
//  // 父级容器
//  container: '#test',
//  // 是否不适配位置
//  // noPosition: true,
//  // 接口地址
//  url: '',
//  // 跨域处理
//  domain: 'sina.com.cn',
//  // 上传的文件格式
//  accept: 'image/*',
//  // 接口返回的回调名称
//  callback: 'file_upload_callback',
//  // 开始上传
//  onUploading: function() {
//      console.log('start');
//  },
//  // 上传完成
//  onComplete: function(res) {
//      console.log(res)
//  }
// });

// new UploadFile({
//  // 父级容器
//  container: '.input-picture',
//  // 是否不适配位置
//  // noPosition: true,
//  // 接口地址
//  url: '',
//  // 跨域处理
//  domain: 'sina.com.cn',
//  // 上传的文件格式
//  accept: 'image/*',
//  // 接口返回的回调名称
//  callback: 'pic_upload_callback',
//  // 开始上传
//  onUploading: function() {
//      console.log('start');
//  },
//  // 上传完成
//  onComplete: function(res) {
//      console.log(res)
//  }
// });