javascript - jQuery .each() 仅打印来自 json 的最后一个值

Question

我有一个问题jQuery.each()。我从另一个 php 文件中检索 json 数据，然后我想从中打印特定的密钥。

这是js：

<div class="row" id="fetchmember">
  <script type="text/javascript">

    jQuery('#group').change(function() {
     var id_group = this.value; 
     var memberjson = "fetchmember.php?group="+id_group;

     jQuery.getJSON(memberjson,function(data){
      jQuery.each(data, function(i, item) {

      jQuery("#fetchmember").empty().append("<li>"+item.name+"</li>");

      });                   
   });
});

</script>
</div> 

来自所选选项之一的 JSON 结果：

[{"id":"1645819602","name":"Michael Great","first_name":"Michael","last_name":"Great"},
{"id":"100000251643877","name":"George Pambudi","first_name":"George","last_name":"Pambudi"}]

我想name从 json 打印所有内容，但它只打印namejson 的最后一个键。我尝试使用 .html() ，它也只返回最后一个name键。我的代码有什么问题？

任何建议和帮助将不胜感激。非常感谢你

Answer 1

您首先清空 div 然后附加：

jQuery("#fetchmember").empty().append("<li>"+item.name+"</li>");

相反，只需使用：

jQuery("#fetchmember").append("<li>"+item.name+"</li>");

Answer 2

如果您不想只保留最后的数据，请不要在循环中清空它。将您的回调更改为

jQuery("#fetchmember").empty();
jQuery.each(data, function(i, item) {
    jQuery("#fetchmember").append("<li>"+item.name+"</li>");
});

请注意，您可以根据需要进行一个附加：

jQuery("#fetchmember").html(data.map(function(item){
    return '<li>'+item.name+'</li>'
}).join(''));