0

我正在尝试使用用户在上传字段中选择的图像,然后才真正上传到服务器端。具体来说,我想让用户在实际上传之前使用一些 jquery 插件来操作图像(裁剪、闪电等)。

我对 JS 没有太多经验,到目前为止,我最终得到了以下代码:

$(".image_upload_form").submit(function (e) {
    "use strict";
    e.preventDefault();
    var input, files, reader;
    input = $("#id_image");
    files = input[0].files;
    if (files && files[0]) {
        reader = new FileReader();
        reader.onload = function (e) {
            $('#img_view').attr('src', e.target.result);
        };
        reader.readAsDataURL(files[0]);
    }
});

效果很好,"#img_view"提交表单后会显示图像。但我需要将函数中的"e.target.result"inreader.onload放入一个变量中,以便在以后的代码中使用它。我怎样才能做到这一点?

4

1 回答 1

2

好吧,如果您正在考虑使用 IE,这将适用于所有浏览器,几乎适用于所有主要浏览器

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

        reader.onload = function (e) {
            $('#imagePreview')
                        .attr('src', e.target.result)
                        .width(240)
                        .height(149);
        };

        reader.readAsDataURL(input.files[0]);
    }
    else {
        $('#imagePreview').attr('src', "../../Images/blqblq.jpg");
    }
}

<img id="imagePreview" class="img-border" src="../../Images/blqblq.jpg" alt="Selected Image"/>
于 2012-12-28T12:57:29.673 回答