使用jQuery从JSON创建<ul> </ul>

时间:2014-10-31 20:57:51

标签: jquery json

在这个下午花了更多的时间,似乎无法让它完全正确。我有一个外部JSON文件,如下所示:

[
    {
        "link": "http://www.google.com",
        "pName":"first partner",
        "vTitle":"Video Title",
        "shortDesc":"Lorem ipsum dolor sit amet, consectetur adipisicing elit. Neque iusto, culpa mollitia, esse nobis iure.",
        "longDesc":"Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quas excepturi optio harum debitis, sed delectus nisi vel dicta, corporis corrupti, omnis ipsam quaerat. Nemo, voluptatum. Asperiores magnam, iste deleniti maxime. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Blanditiis, recusandae, quod. In assumenda, modi velit itaque enim sunt tempore eum, perspiciatis hic, vitae voluptas. Iste et sint odit molestiae illo."
    }
]

我需要从每个中创建一个li并显示它。 这是我得到的最接近的,虽然它说我的一个项目(链接)没有定义:

$(function(){
    $.getJSON('./JSON/latest.json', function(data) {
        var items = [];
        $.each(data, function(i, item) {
        items.push('<li><a href="' + link + '">' + pName + '</a><span class="vTitle">' + vTitle + '</span>' + shortDesc + '</li>');
        });
        $('#latestList').append( items.join('') );
    });
});

3 个答案:

答案 0 :(得分:3)

上下文是&#39; item&#39;所以你需要从中读取属性。

$(function(){
  $.getJSON('./JSON/latest.json', function(data) {
    var items = [];
    $.each(data, function(i, item) {
      items.push(
        '<li>' +
          '<a href="' + item.link + '">' + item.pName + '</a>' +
          '<span class="vTitle">' + item.vTitle + '</span>' +
          item.shortDesc +
        '</li>');
    });
    $('#latestList').append( items.join('') );
  });
});

答案 1 :(得分:1)

我认为您需要指定item.link

答案 2 :(得分:0)

而不是链接和pName等等

item[0].link
item[0].pName
item[0].vTitle
item[0].shortDesc