1

我有一个上传脚本，它显示了使用 JQuery 上传的照片的预览。现在我想将 JCrop 应用到该预览图像，但它没有将照片加载到 JCrop 区域。该脚本似乎可以工作，并且 JCrop 区域在预览所在的位置打开，但没有显示照片。谁能帮我解决这个问题？

function readURL(input) {

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

                reader.onload = function (e) {
                    $('#avatar').attr('src', e.target.result);
                }
                reader.readAsDataURL(input.files[0]);
            }
        }
        $("#imgInp").change(function(){
            readURL(this);
            $('#avatar').Jcrop(); // JCROP Displayed but no Image shown
        });

<img id="avatar" src="#" alt="your image" />
<input type='file' id="imgInp" />
4

1 回答 1

2

您在使用 Internet Explorer 吗？Internet Explorer < 10 不支持您在尝试获取 input.files 时使用的文件 API。所以阅读器永远不会被设置和加载（尽管我相信阅读器在 IE 中也不支持）。不幸的是，我正在研究一个类似的问题，所以只能告诉你为什么它不起作用，而不是如何使它起作用（还），但大多数提到的选项是使用闪存或将图像上传到临时文件。

IE 对文件 API 的支持： http: //caniuse.com/#search=file%20api

文件 API：http ://www.w3.org/TR/FileAPI/

于 2013-10-29T16:19:54.883 回答