Javascript 使用JQuery显示表内的图像

我使用AJAX向API发送请求，并使用包含图像URL和各种元数据的JSON检索响应

我试图在html表中显示这些图像，但出于某种原因，

localhost:8000

（我正在从localhost进行测试）被附加到图像标记内每个url的开头

以下是从AJAX响应生成html的代码：

success: function(response) {
            var trHTML = '';
            $.each(response, function (i, item) {
                var img1 = '<a href="' + item.url1 + '"><img src=">' + item.url1 + '"></a>';
                var img2 = '<a href="' + item.url2 + '"><img src=">' + item.url2 + '"></a>';

                trHTML += '<tr><td>' + item.score + '</td><td>' + img1 + '</td><td>' + img2 + '</td></tr>';
            });
                // append results to table
                $('#resultsTable').append(trHTML);
          }

但是，

href

命令中的url工作正常，并且指向正确的位置：

https://url-of-my-image.jpg

---

有人能解释一下发生了什么事吗？有一次，问题只出现在

标记内的url上。

看起来您有一个额外的不必要的收尾角括号，请尝试：

success: function(response) {
        var trHTML = '';
        $.each(response, function (i, item) {
            var img1 = '<a href="' + item.url1 + '"><img src="' + item.url1 + '"/></a>';
            var img2 = '<a href="' + item.url2 + '"><img src="' + item.url2 + '"/></a>';

            trHTML += '<tr><td>' + item.score + '</td><td>' + img1 + '</td><td>' + img2 + '</td></tr>';
        });
            // append results to table
            $('#resultsTable').append(trHTML);
      }

成功：功能（响应）{
var trHTML=''；
$。每个（响应、功能（i、项目）{
var img1=''；
var img2=''；
trHTML+=''+item.score+''+img1+''+img2+''；
});
//将结果追加到表中
$（'#resultsTable'）.append（trHTML）；
}

不应该将“+item.url1”放在src=非常感谢之后。这是一个愚蠢的错误，花费了我太多的时间：）有时当一个人很累并且盯着同一段代码看太久时，很容易错过：）

success: function(response) {
        var trHTML = '';
        $.each(response, function (i, item) {
            var img1 = '<a href="' + item.url1 + '"><img src="' + item.url1 + '"/></a>';
            var img2 = '<a href="' + item.url2 + '"><img src="' + item.url2 + '"/></a>';

            trHTML += '<tr><td>' + item.score + '</td><td>' + img1 + '</td><td>' + img2 + '</td></tr>';
        });
            // append results to table
            $('#resultsTable').append(trHTML);
      }