var _callbacks = new Map();
function UploadImg(callback, id = null) {
    if (IsNOE(id)) {
        id = "_upload_img_" + randomString(8);
        _callbacks.set(id, callback);
        document.body.insertAdjacentHTML("beforeEnd", '<input type="file" >')
        document.getElementById(id).click();
    } else {
        let uploadImgElement = document.getElementById(id);
        let fileObj = uploadImgElement.files[0];
        let form = new FormData();
        form.append("file", fileObj);
        xhr = new XMLHttpRequest();  // XMLHttpRequest 对象
        xhr.open("post", "//file.qchtc.com/img/upload", true); //post方式,url为服务器请求地址,true 该参数规定请求是否异步处理。
        xhr.onload = function (evt) {
            try {
                var result = JSON.parse(evt.target.responseText);
                callback = _callbacks.get(id);
                callback(result);
            } catch (e) {
                console.log(e);
            } finally {

                document.getElementById(id).remove();
            }
        };
        xhr.onerror = function () {
            _callbacks.delete(id);
            document.getElementById(id).remove();
        };
        xhr.upload.onprogress = function () {
            //【上传进度调用方法实现】
        };
        xhr.upload.onloadstart = function () {
            console.log("正在上传")
        };
        xhr.send(form); //开始上传,发送form数据
    }
}

  

调用:

 UploadImg((r) => {
      console.log(r);
 })

  

相关文章:

  • 2021-12-13
  • 2021-12-18
  • 2022-12-23
  • 2021-12-24
  • 2022-01-28
猜你喜欢
  • 2022-03-06
  • 2022-12-23
  • 2022-12-23
  • 2021-12-26
  • 2022-12-23
  • 2021-12-05
  • 2021-12-05
相关资源
相似解决方案