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 pletely new code then please tell me.

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 pletely new code then please tell me.

• javascript
• jquery
• internet-explorer
• google-chrome

Share Improve this question Follow edited Jul 29, 2011 at 9:47 Joachim Sauer 309k5959 gold badges567567 silver badges622622 bronze badges asked Jul 29, 2011 at 9:09 PeeyushPeeyush 4,8681717 gold badges6666 silver badges9292 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 1

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

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