上传的图片预览

Question

在将上传的图像发送到服务器之前，我使用以下javascript代码来预览它：

function readURL(input) {

    if (input.files && input.files[0]) {
        if(input.files[0].type.match('image.*')){
            var reader = new FileReader();

            reader.onload = function (e) {
                $('#logo-preview').attr('src', e.target.result);
            };

            reader.readAsDataURL(input.files[0]);
        }
    }
}

$("#upload-logo").change(function(){
    readURL(this);
});

这在Chrome、火狐、Safari上运行得很好，在IE10和IE11上也令人惊讶。不过，在IE上，我无法在某些计算机上读取PNG图像。例如，我有两台安装了Windows7的电脑，IE11...one可以读取PNG图像，而另一台则不能。有没有人知道问题出在哪里？

Answer 1

http://blog.revathskumar.com/2012/04/html5-show-thumbnail-preview-of-image.html

上面的url包含一个示例代码，以及一个有效的演示，它使用了FileReader和Canvas。我在IE 11上进行了测试，它工作正常。我建议在两台计算机上都使用该示例，看看是否也能正常工作。

您还可以确保您的一台计算机未在兼容性视图中运行IE。