2

I just need to display the image chosen (Browse) by the user before the upload. For this purpose i am using this code:

JS

function setImage(file) {
    if(document.all)
        document.getElementById('prevImage').src = file.value;
    else
        document.getElementById('prevImage').src = file.files.item(0).getAsDataURL();
    if(document.getElementById('prevImage').src.length > 0) 
        document.getElementById('prevImage').style.display = 'block';
}

HTML

<img id="prevImage"  src=""  alt="" width="313" height="315" />
<input name="photo1" id="photo1" type="file" onchange="setImage(this);"  value="" class="input" size="17"/>

This code working fine in Safari, Firefox 3,4,5 but doesn't work in Google Chrome 12 or higher and IE 8, 9.

So please tell me any solution regarding this issues?

I already tried other solution given on this website but they are also not working in all major browsers.

if you have a solution for this code or a completely new code then please tell me.

Joachim Sauer
  • 302,674
  • 57
  • 556
  • 614
Peeyush
  • 4,728
  • 16
  • 64
  • 92

2 Answers2

1

I find a complete solution from another stack post, here is the solution.

Community
  • 1
  • 1
Awea
  • 3,163
  • 8
  • 40
  • 59
0

You can also use FileReader which is a standard Web API now.

gdm
  • 7,647
  • 3
  • 41
  • 71