Question

I upload an image file from my PC and then read it as dataurl. Then pass it to img element to preview it. It is working fine in firefox. But in chrome and IE, it doesn’t get the src from the file reader.

Here is what i’m doing,

var image = document.createElement("img");
    var thumbnail = document.getElementById("thumbnail");
    image.file = file;
    thumbnail.appendChild(image);

    function handlefilereader(evt){
     image.src = evt.target.result; 
    }

    var reader = new FileReader()
    reader.onload = handlefilereader;
    reader.readAsDataURL(file);

    image.id = count;
    count++;
    image.draggable = true;
    image.ondragstart = dragIt;
    alert(image.src);

Answer 1

Filereader may not be supported in your browser versions. See this compatibility chart.

http://caniuse.com/filereader

Also, event.target is not fully browser compatible. Consider

var target = evt.target || evt.srcElement;
image.src = target.result;