Wie ausgewähltes Bild von HTML-Eingabe

Question

Zum Beispiel entfernen ich diese Form habe

<form> 
<input type='file' id="imgInp" /> 
<img id="blah" src="#" alt="your image" /> 
</form> 

Und dieses Skript zeigen Bild

function readURL(input) { 
    if (input.files && input.files[0]) { 
     var reader = new FileReader(); 

     reader.onload = function (e) { 
      $('#blah').attr('src', e.target.result); 
     } 

     reader.readAsDataURL(input.files[0]); 
    } 
} 

$("#imgInp").change(function(){ 
    readURL(this); 
}); 

ich eine Taste legen will, um die ausgewählte Bild zu entfernen, wie zB:

<a href="#">remove</a> 

Wie können wir das tun?

DEMO

Answer 1

erstellen Link in der Form "entfernen", die zunächst verborgen ist.

<form> 
    <input type='file' id="imgInp" /> 
    <a style="display:none;" id="removeImage" href="#">Remove</a> 
    <img id="blah" src="#" alt="your image" /> 
</form> 

Und in der JavaScript-Datei,

$("#imgInp").change(function() { 
    readURL(this); 
    $("#removeImage").toggle(); // show remove link 
}); 

$("#removeImage").click(function(e) { 
    e.preventDefault(); // prevent default action of link 
    $('#blah').attr('src', ""); //clear image src 
    $("#imgInp").val(""); // clear image input value 
    $("#removeImage").toggle(); // hide remove link. 
});