无法在javascript中显示base64字符串中的图像

我试图显示一个原始图像，该图像已被格式化为base64，并使用javascript显示为img元素。我已经有了base64，但无法将其显示为原始图像，代码有什么问题

这是代码

 $.each(post.JobPictures, function (i, pictures) {
                                            if (pictures != null) {
                                                var decodedString = atob(pictures.JobImageContentBytes)
                                                var img = new Image();
                                                img.src = ("data:image/jpg;base64,"+ decodedString);

                                                `<div class="separate-pic">
                                                    <img class="posted-pic" src="`+img+`" alt="" />
                                                </div>`
                                             }
                                    })

$。每个（post.JobPictures，函数（i，图片）{
如果（图片！=null）{
var decodedString=atob（pictures.JobImageContentBytes）
var img=新图像（）；
img.src=（“数据：image/jpg；base64，”+decodedString）；
`
`
}
})

现在正在使用地图更新，但它根本不进入

$.ajax({
        url: '@Url.Action("SearchByCategory", "AllJobs")',
        type: 'GET',
        contentType: 'JSON',
        data: { category: categoryId },
        success: function (posts) {

            $(".job-container").html("");
            //$(".job-container").load(" .job-container");

            $.each(posts.FindJobs, function (i, post) {

                var newdate = new Date(post.PostedDate + 'Z');
                var day = newdate.getDate();


                $(".job-container").append(`


                        <li class="separate-job" id="All-Jobs-Id" value="` + post.jobId + `">
                            <div class="content-li-All-Jobs">
                                <h2 class="content-li-All-headline" id="headline-for-Update">`+ post.Headline + `</h2>
                                <a class="btn btn-success bid-for-job" value="`+ post.jobId + `" href="#">Bid now</a>
                                <div class="user">
                                    <blockquote class="blockquote">
                                        <p class="mb-0">
                                            <div class="about-job">`+ post.About + `</div>
                                        </p>
                                        <div class="blockquote-footer">
                                            <cite>-`+ post.Username + `</cite>
                                        </div>
                                    </blockquote>
                                </div>
                                <div class="pictures-li">
                                   `+ $.map(post.jobPictures, function (i, pictures) {
                        if (pictures != null) {
                            var decodedString = atob(pictures.JobImageContentBytes)
                            return `<div class="separate-pic">
                <img class="posted-pic" src="data:image/jpg;base64,${decodedString}" alt="" />
            </div>`;
                        }
                    }).join("") + `
                                </div>

                                <div class="job-date-li">
                                    Posted `+ newdate.getDate() + ` ` + newdate.getMonth() + ` ` + newdate.getFullYear() + 
                `

                                </div>
                                <div class="-job-town">Area | <span class="city">`+ post.JobCity+`</span></div>
                            </div>
                        </li>



                 `)

            });



        }
    });

$.ajax({
url:'@url.Action（“SearchByCategory”、“AllJobs”），
键入：“GET”，
contentType:'JSON'，
数据：{category:categoryId}，
成功：职能（员额）{
$（“.job container”）.html（“”）；
//$（“.job container”）.load（“.job container”）；
$.each（posts.FindJobs，函数（i，post）{
var newdate=新日期（post.PostedDate+'Z'）；
var day=newdate.getDate（）；
$（“.job container”）.append(`

`+邮政标题+`

`+post.About+`

-`+post.Username+`
`+$.map（post.jobPictures，函数（i，图片）{
如果（图片！=null）{
var decodedString=atob（pictures.JobImageContentBytes）
返回`
`;
}
}).join（“”+`
发布了`+newdate.getDate（）++`+newdate.getMonth（）++`+newdate.getFullYear（）
`
区域|`+邮政工作城市+`

`)
});
}
});

这是我对控制器的整个ajax调用，目的是获取特定类别中的所有作业，创建这些div并将相关数据分配给它们

下图显示了对象/数组不是空的

$。each（）

返回其第一个参数的值，因此这相当于写入：

+ post.JobPictures + 

您需要使用

$.map（）

，回调函数需要返回一些内容，然后您可以使用

.join（）

将结果数组连接成字符串

您不应该尝试将

img

元素直接连接到字符串中。相反，将base64字符串替换为

src

属性

`JobImageContentBytes'中的数据已编码为base64，无需调用任何函数对其进行编码

JobPictures

开头有一个大写的

J

$.map的回调函数的参数应按
元素
，
索引
的顺序排列

+ $.map(post.JobPictures, function (pictures) {
    if (pictures != null) {
        return `<div class="separate-pic">
                    <img class="posted-pic" src="data:image/jpg;base64,${pictures.JobImageContentBytes}" alt="" />
                </div>`;
     }
}).join("") + 

而是写

src="${img}"

@Taplar抱歉，我的错，我在.append方法中使用了以下代码段。现在更清楚了？所以，基本上，我有一个带有一些字节的数组，我循环通过项目来显示img并创建div+img元素。我还应该怎么做？我真的很高兴confused@Taplar我不想对它做任何事情-我只想在一个div中显示img，根据数组的长度，它将使用这些图像生成这些div。我将更新帖子以查看整个append以及其中的内容…
contentType:'JSON'，
是错误的，它应该是
dataType:'json'
Comments。
src="${img}"