Question

我有一个上传脚本，显示使用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" />

Answer 1

您使用的是Internet Explorer吗？ Internet Explorer＆lt; 10不支持在尝试获取input.files时使用的File API。所以读者永远不会设置和加载器（虽然我确实认为读者在IE中也不受支持）。不幸的是我正在研究类似的问题，所以只能告诉你为什么它不起作用，而不是如何让它工作（但），但大多数提到的选项是使用flash或将图像上传到临时文件。

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

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

JQuery上传，预览，裁剪

1 个答案: