在IE中预览的图像上传

Question

我正在进行图片上传,我要在上传前预览图像(比如在twitter.com上实现显示图片)

我已经写了一些JS代码,它在chrome和Firefox上工作正常,但不能在IE上工作(8或9)

  function PreviewImg(input) {
        if (input.files && input.files[0]) {
            var reader = new FileReader();

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

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


<input type="file" name="logofile" class="txtbox" onchange="PreviewImg(this);" />
  <img id="previmg" src="#" />

我在IE中调试了代码.input.files在IE中显示为null,任何人都可以告诉解决方案或任何其他解决方案来实现功能问候

Answer 1

这不适用于IE,因为代码依赖于IE不支持的HTML5文件API.它将从IE10开始支持它.因此,如果您需要支持低于10的IE,您可以使用一些现有的AJAX上传组件(Uploadify,Plupload,Valums AJAX Upload,Bleuimp,...)将文件上传到服务器,在服务器上生成并存储缩略图并使用JSON将保存的图像发送到客户端,以便它可以使用<img>标记显示它.实际上,由于IE支持数据URI方案,因此您无需将上载的文件存储到服务器以生成预览.您可以直接从格式为数据URI方案的预览控制器操作返回生成的缩略图图像,以便您可以在客户端上显示它.

如果您没有时间和资源来实现此功能,另一种解决方案是简单地告诉您的用户,如果他们想要使用不同的Web浏览器来考虑他们应该考虑的图像的实时预览,因为您的网站不支持IE为此.