如何在上传之前使用JavaScript或jQuery来预览图像？

Question

我只需要在上传之前显示用户选择的（浏览）图像。为此我使用此代码：

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"/> 

这个代码在Safari，火狐3,4,5-工作正常，但不在Google Chrome 12或更高版本以及IE 8,9中工作。

那么请告诉我有关此问题的任何解决方案吗？

我已经尝试过在这个网站上给出的其他解决方案，但它们也不适用于所有主流浏览器。

如果您有此代码的解决方案或全新的代码，请告诉我。

Answer 1

我找到了另一个完整的解决方案stack post,here是解决方案。

Answer 2

您现在也可以使用FileReader这是一个标准的Web API。