仅在上传时显示图像 (xhr.addEventListener)

Question

我试图在上传过程中显示图片，并在上传完成后将其移除。

我已成功显示图片，但上传完成后图片仍保留在那里。完成后如何删除它。

xhr: function() {
  var xhr = new window.XMLHttpRequest();
  //Upload progress
  xhr.upload.addEventListener("progress", function(evt) {
    if (evt.lengthComputable) {
      var percentComplete = evt.loaded / evt.total;
      console.log(percentComplete * 100 + '%');
      document.getElementById("status").innerHTML = "<img src='spinner.gif' alt='img' />";
    }
  }, false);
  return xhr;
},

实例：http://codepen.io/DrCustUmz/pen/KzZOeP

Answer 1

将此添加到您的 ajax 成功函数中：

success: function(result) {
   document.getElementById("status").innerHTML = "";
    //other code
     };

仅在上传时显示图像 (xhr.addEventListener)

Show an image only while uploading (xhr.addEventListener)

html

javascript

upload

image

addeventlistener