L-xl 2020-03-13 11:05 采纳率: 75%
浏览 1189
已采纳

请问如何将img的src获取为base64后赋值给一个对象?

我实现了一个上传图片的功能,现在需要获取该图片的base64码赋值给一个对象。

    let fileDom = document.getElementById("inputLogo");
    let previewDom = document.getElementById("preview");

        fileDom.addEventListener("change", e => {
        let file = fileDom.files[0];
        if (!file || file.type.indexOf("image/") < 0) {
            fileDom.value = "";
            previewDom.src = "";
            return;
        }

        let fileReader = new FileReader();
        fileReader.onload = e => {
            previewDom.src = e.target.result;
            path = fileReader.result;
        };
        fileReader.readAsDataURL(file);

这里面我通过previewDom.src = e.target.result;获得的src是这样的,可以通过alert打印出来

图片说明

但通过控制台输出previewDom.src,显示的是

图片说明

通过path = fileReader.result;我在控制台可以得到base64码

图片说明

但是alert打印没有效果.

请问一下:这是什么原因?

target.result和result得到的值有什么区别?

我的目的是想要的到path这个变量的base64码,赋给一个对象

     obj = {
            header: {      
         //在这里得到img的base64码,赋值给imgLogo
            imgLogo: path
                                     }
            }

在控制台打印obj.header.imgLogo显示

图片说明

这应该是没有赋值成功吧?

我想请教一下应该怎么做才能实现把我上传图片的base64码赋值给obj.header.imgLogo里面?

  • 写回答

2条回答 默认 最新

  • zt13502162671 2020-03-14 11:32
    关注

    控制台里面你没有定义previewDom,它不知道你是什么。默认为undefined
    你代码里面的东西,不要想着通过控制台调试。
    你最好像是

    <script>
        var i="sds"
        console.log(i);
    </script>
    
    

    不然就是你一步步在控制台里面把代码敲完后看输出,不要想着,控制台走半步,代码走半步。

      let previewDom = document.getElementById("preview");
        obj.header.imgLogo=previewDom.src
    
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(1条)

报告相同问题?

悬赏问题

  • ¥20 基于spring boot、的scorm
  • ¥15 往复密封问题的两个问题
  • ¥15 DAC函数和STM32
  • ¥15 任务是接收数据并把数据写入DAC7311,这些代码能实现此功能吗
  • ¥15 分析FP -Growth代码运行内存太大而无法运行的原因
  • ¥20 qtcreat 使用msvc编译器开发软件运行时字体锯齿感严重
  • ¥15 为何显示keyerror fruit
  • ¥15 imageware粗糙度表面
  • ¥15 为什么我的uibot导入py模块出错呀。py文件放在了uibot里对应的python文件夹了,卸了重安也不行
  • ¥15 开源或低价数据中台哪个最好