Question

我想知道如何将json文件中的几个图像加载到li？这是json文件

[
{"id":"1",
 "link":"11.jpg",
}
{"id":"2",
 "link":"12.jpg",
}
{"id":"3",
 "link":"13.jpg",
}
]

我有<ul id="links"></ul>

我试过这个，但没有成功：

$.getJSON("feed.json", loadImage);
 function loadImage(data) {
 $.each(data.link, function(i,item){
    $("<img/>").attr("src", item).appendTo("#links");
 });
 }

任何想法？

编辑：即使item仍然无效。图像位于同一文件夹中

Answer 1

首先，您可以在使用之前尝试定义loadImage函数。无论如何，它看起来应该更像：

$.getJSON("feed.json", function(data) {
    $.each(data, function(i,item) {
        $("<img/>").attr("src", item.link).appendTo("#links");
    }
});

Answer 2

您应该使用item函数中的each参数而不是data.link。因为item引用了您正在迭代的当前项目。

变化：

$("<img/>").attr("src", data.link).appendTo("#links");

以下内容：

$("<img/>").attr("src", item.link).appendTo("#links"); // Changed data.link to item.link

尝试在item函数中跟踪each。

Answer 3

$.getJSON("feed.json", loadImage);
 function loadImage(data) {
 $.each(data.items, function(i,item){
    $("<img/>").attr("src", item.link).appendTo("#links"); //use item.link. 
 )};
}

如何从json数组加载图片？

3 个答案: