I want to create a preview for image before upload it on the server, using JQuery.

My code, js code:

$(function(){

    Test = {

        UpdatePreview: function(obj){

          // if IE < 10 doesn't support FileReader

          if(!window.FileReader){

             // don't know how to proceed to assign src to image tag

          } else {

             var reader = new FileReader();

             var target = null;



             reader.onload = function(e) {

              target =  e.target || e.srcElement;

               $(img).prop(src, target.result);

             };

              reader.readAsDataURL(obj.files[0]);

          }

        }

    };

});

My html:

    <input type='file' name='browse' onchange='Test.UpdatePreview(this)'  />

<br/><br/>

   <img src=# alt=test width=128 height=128 />

See jsfiddle: http://jsfiddle.net/aAuMU/

After onload, I see the src of image (using Google console application) and it looks like:

data:image/jpeg;base64,/9j/4AAQSkZJRgABAgAAAQABAAD//gAEKgD/4gv4SUNDX1BST0ZJTEUAAQEAAAvoAAAAAAIAAABtbnRyUkdCIFhZWiAH2QADABsA...

It is a way to get in javascript the base of image and assign to image in case I'm using IE as browser ?

FileReader doesn't work in IE < 10.