Question

我正在尝试api调用以获取子类别列表。我的json看起来像这样

    {
        "description": "Flower", 
        "name": "Flower", 
        "parent_id": "1"
    }, 
    {
        "description": "Moon", 
        "name": "Moon", 
        "parent_id": "1"
    }
]

这就是我到目前为止所学到的。

    <script type="text/javascript">
        $('button').click(function() {

    $.ajax({
        url: "/api/subcategories?sstr=ball",
        dataType: 'json',
        type: "GET"
    })
    .done(function(data) {
        $('.results').append('<ul class="list"></ul>');
        $.each(data, function(key, value) {
            console.log(data)
            $('.list').append('<li>' + key + ': ' + value + '</li>');
        });
    })
    .fail(function(event) {
        alert(event.status);
    });
});
    </script>

我得到的结果是 0：[对象] 1：[对象] 2：[对象]
我想要的是名单。

Answer 1

其中value是作为对象的数组元素，而不是获取其名称属性。

$('.list').append('<li>' + key + ': ' + value.name + '</li>');

由于它是一个数组，您也可以使用JavaScript Array#forEach方法。

data.forEach(function(value, key) {
  $('.list').append('<li>' + key + ': ' + value.name + '</li>');
});

或者您可以使用Array#map和Array#join方法生成HTML字符串，将其缩减为单个附加语句。

 $('.results').append(
   '<ul class="list">' +
   data.map(function(value, key) {
     return '<li>' + key + ': ' + value.name + '</li>');
   }).join('') + 
  '</ul>'
 );

Answer 2

首先，您需要解析json字符串以将其转换为javascript数组。

这样做 - ＆gt; var json_data = jQuery.parseJSON（data）;

现在，

var html = "";

html += '<ul>';

$.each( json_data, function( key, value ) { 

  html += '<li>'+key+':'+value['name']+'</li>';       

});

html += '</ul>';

$('.list').html(html);

我认为这样做会有所帮助。

来自Json获取关键Javascript的声音

2 个答案: