首页 > 解决方案 > 从 Ajax 成功响应中循环遍历数组并为多个图像占位符附加图像 src 属性

问题描述

我正在尝试遍历一个数组并将 Base64 数据 URL 附加到来自 Ajax Success 响应的多个图像占位符(这些是在 Asp.net Webforms 页面中动态创建的)的图像 src 属性。

这是我尝试过的:

success: function (response) {
    var getData = JSON.parse(response.d);
    for (var x = 0; x < getData.length; x++) {
        uri = getData[x].ImageURI;
        imageID = getData[x].ID;
        $("[id*=ContentPlaceHolder1_Image",{imageID},"]").attr("src", uri);
    }
},

我的图像占位符如下所示:

<img id="ContentPlaceHolder1_Image236" src="The Base64 URL goes here">
<img id="ContentPlaceHolder1_Image237" src="The Base64 URL goes here">
<img id="ContentPlaceHolder1_Image238" src="The Base64 URL goes here">
...

src除了设置属性外,我还将响应中的图像 ID 附加到此占位符。我在控制台中没有任何错误,但没有填充图像。

标签: javascriptajax

解决方案


您需要连接字符串以创建它们的选择器

所以要么使用+和字符串

$("[id*=ContentPlaceHolder1_Image" + imageID + "]").attr("src", uri);

或模板文字(注意不同的引号和$

$(`[id*=ContentPlaceHolder1_Image${imageID}]`).attr("src", uri);

推荐阅读