如何在使用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，Firefox 3、4、5中可以正常工作，但在Google Chrome 12或更高版本以及IE 8、9中不起作用。

因此，请告诉我有关此问题的任何解决方案？

我已经尝试过此网站上提供的其他解决方案，但它们也不能在所有主流浏览器上使用。

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

Answer 1

我从另一个堆栈文章中找到了完整的解决方案， 这是解决方案。

Answer 2

您现在也可以使用FileReader ，它是一种标准的Web API。