Jquery: How to dynamically SHOW image using the “value” of <input type=“file”> Field

Question

I was wondering whether there is a way to dynamically display an image that a user just uploaded to the input type=\"file\" field.

For example, so far I have the fol

Answer 1

Take a look at this sample, this should work: http://jsfiddle.net/LvsYc/

HTML:

JS:

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