从输入文件中显示预览图像

博士3am3rz

问题在于“ this”,如果我将其更改为“#photo1”,则图像将能够显示。

我输入了一些文件,这就是为什么我需要编辑代码的原因。我不知道发生了什么事。

$(".pro-set-up-photo-preview").hide();

    $("#photo1").change(function () {
        var reader = new FileReader();

        reader.onload = function (e) {
            // get loaded data and render thumbnail.
            $(this).next().next("img").attr('src', e.target.result);
        };

        // read the image file as a data URL.
        reader.readAsDataURL(this.files[0]);
        $(this).next().next("img").show();
    });

这是我的代码

塞巴斯蒂安(Sebastianb)

this在嵌套函数引用FileReader对象。您应该在reader.onload回调之前将对#photo1的引用保存在本地变量中

var photo = $(this);

然后使用photo代替$(this)

reader.onload = function (e) {
    // get loaded data and render thumbnail.
    photo.next().next("img").attr('src', e.target.result);
};

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

追加浏览文件输入不显示预览图像

来自分类Dev

渲染图像以从文件输入标签中的选定文件预览

来自分类Dev

在预览中显示多张图像

来自分类Dev

在 Javascript 中显示来自文件输入的图像

来自分类Dev

多个输入文件上的Javascript图像预览

来自分类Dev

如何通过单击图像预览上的“ x”从输入的文件中删除图像?

来自分类Dev

在 angularjs 中显示图像预览时出错

来自分类Dev

javascript FileReader:预览多个文件中的图像

来自分类Dev

输入文件在JCrop中显示实时选择的图像

来自分类Dev

输入文件在JCrop中显示实时选择的图像

来自分类Dev

具有多个输入文件的多图像预览

来自分类Dev

React.js用输入类型文件预览图像

来自分类Dev

预览 2 个或多个多输入文件的图像

来自分类Dev

显示没有图像的视频中的Jwplayer预览图像

来自分类Dev

显示没有图像的视频中的Jwplayer预览图像

来自分类Dev

在Xcode中预览不显示资产库中的图像

来自分类Dev

如何在Django管理界面中显示BinaryField图像预览?

来自分类Dev

图像预览/拇指未在 Drupal 8 中显示

来自分类Dev

如何显示来自文件输入的图像?

来自分类Dev

如何预览文件夹图标中的图像?

来自分类Dev

显示HTML5 <input type =“ file”>所选图像文件的预览图像

来自分类Dev

Angular.js仅在所选文件为图像时才显示图像预览

来自分类Dev

显示输入文件中的项目

来自分类Dev

在OS X Yosemite Finder预览中显示PNG文件的尺寸

来自分类Dev

图像未在输入字段中显示

来自分类Dev

难以显示用户在Tkinter中输入的图像

来自分类Dev

表单输入显示图像中的文字值

来自分类Dev

根据Excel中的输入显示不同的图像

来自分类Dev

Krajee引导程序文件输入-显示数据库中的图像

Related 相关文章

  1. 1

    追加浏览文件输入不显示预览图像

  2. 2

    渲染图像以从文件输入标签中的选定文件预览

  3. 3

    在预览中显示多张图像

  4. 4

    在 Javascript 中显示来自文件输入的图像

  5. 5

    多个输入文件上的Javascript图像预览

  6. 6

    如何通过单击图像预览上的“ x”从输入的文件中删除图像?

  7. 7

    在 angularjs 中显示图像预览时出错

  8. 8

    javascript FileReader:预览多个文件中的图像

  9. 9

    输入文件在JCrop中显示实时选择的图像

  10. 10

    输入文件在JCrop中显示实时选择的图像

  11. 11

    具有多个输入文件的多图像预览

  12. 12

    React.js用输入类型文件预览图像

  13. 13

    预览 2 个或多个多输入文件的图像

  14. 14

    显示没有图像的视频中的Jwplayer预览图像

  15. 15

    显示没有图像的视频中的Jwplayer预览图像

  16. 16

    在Xcode中预览不显示资产库中的图像

  17. 17

    如何在Django管理界面中显示BinaryField图像预览?

  18. 18

    图像预览/拇指未在 Drupal 8 中显示

  19. 19

    如何显示来自文件输入的图像?

  20. 20

    如何预览文件夹图标中的图像?

  21. 21

    显示HTML5 <input type =“ file”>所选图像文件的预览图像

  22. 22

    Angular.js仅在所选文件为图像时才显示图像预览

  23. 23

    显示输入文件中的项目

  24. 24

    在OS X Yosemite Finder预览中显示PNG文件的尺寸

  25. 25

    图像未在输入字段中显示

  26. 26

    难以显示用户在Tkinter中输入的图像

  27. 27

    表单输入显示图像中的文字值

  28. 28

    根据Excel中的输入显示不同的图像

  29. 29

    Krajee引导程序文件输入-显示数据库中的图像

热门标签

归档