Nur während des Hochladens ein Bild anzeigen (xhr.addEventListener)

Question

Ich versuche, während des Hochladens ein Bild anzuzeigen, und entferne es, wenn der Upload abgeschlossen ist.

Ich habe es geschafft, das Bild anzuzeigen, obwohl nach dem Hochladen das Bild bleibt dort. Wie kann ich es entfernen, sobald es fertig ist.

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; 
}, 

anschauliches Beispiel: http://codepen.io/DrCustUmz/pen/KzZOeP

Answer 1

Fügen Sie diese auf Ihre Ajax-Erfolg Funktion:

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