Javascript 如何使用循环提取数组中的json数据？

大家好，我有个问题。我不知道怎么解决它。我是ajax处理的初学者。我希望你能帮助我

我有一个来自成功的ajax数据。我想把它放到一个数组中。因为我想把json数据放在选项选择框中

这是我的密码：

我的控制器里有这个

$('#state').on('change',function(){

            var state_code = $('#state').val();

            var city_url = '<?php echo site_url("locations/displayCity/' + state_code + '"); ?>';

            $.ajax({

                type: 'POST',
                url: city_url,
                data: '',
                dataType: 'json',
                async: false,
                success: function(i){

                    console.log(i)

                }

            });

        });

在my console.log中，我有以下内容：

[Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object]
0: Object
1: Object
2: Object
3: Object
4: Object
5: Object
6: Object
7: Object
8: Object
9: Object
10: Object
11: Object
length: 12

原型：数组[0]

如果单击对象中的箭头，我将得到以下结果：

Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object]
0: Object
id: "1028"
name: "Butuan City"
__proto__: Object
1: Object
id: "1029"
name: "Buenavista"
__proto__: Object
2: Object
3: Object
4: Object
5: Object
6: Object
7: Object
8: Object
9: Object
10: Object
11: Object
length: 12
__proto__: Array[0]

---

就这些。谢谢。

您的回复已经是数组了。只需使用jQuery.eachi、functionindex、item{…}对其进行迭代即可

试试这个-

var select=$('#city');
for (var j=0; j<i.length; j++)
{
   select.append('<option value="'+i[j].id+'">'+i[j].name+'</option>');
}

---

根据您的代码，我修改了它，以满足您的需要

success: function(i)
{
var resultingObj = JSON.parse(i);

    for(var iterator = 0; iterator < resultingObj.length; iterator++)
    {
        //perform actions
        $('#city').append('<option value="' + resultingObj[iterator].id + '">' + resultingObj[iterator].name + '</option>');
    }
}

使用此项—

$.each(i, function(key,val){

 $('#city').append("<option value='" + key + ">" + val + "</option>");

});

不要这样使用append，它每次在选择框中追加都会先生成一个字符串，然后在选择框中设置完整的html。它是快速的，然后追加

var str='';
$.each(i, function(index,value){
str +="<option value='"+value.id+"'>"+value.name+"</option>";


});
 $('#city').html(str);

我理解你在console.logi；你得到了正确的回答。 现在您需要做的是，解析该对象，然后将其设置为select选项

根据我的经验，这是一个棘手的部分，因为选择选项不能由html自动设置

因此，如果您想在某个代码前面加上前缀，下面是一些可用的代码

$(document).ready(function () {
    var size =    $('select').children('option').length;
    for (i=0;i<size;i++)
    {
        if ( $('select').children('option')[i].value === resultingObj.whatever)
        {
             $('select').children('option')[i].selected=true;
        }
    }
});

---

祝你好运，试试这样吧

    $.ajax({
           type: 'POST',
           url: city_url,
           data: '',
           dataType: 'json',
           async: false,
           success: function(response){
            var resp_length = response.length;
            var option = '';
            for(var i = 0; i< resp_length;i++){
                option += '<option value="'+response[i].id+'">'+response[i].name+'</option>';
            }
            $('#city').append(option);//Opertation on DOM only one time.
           }
       });

使用以下脚本

$.ajax({
  ...
  ...
  success: function(response){
    var option = null;
    //iterate each json record
    $(response).each(function(index, record){

      //create option tag with value and record name
      option = $('<li>').attr('value', record.id).html(record.name);

      //append this option tag to select box
      $('#city').append(option);
    });
  }

});

替换

success: function(i){
    console.log(i)
}

与

---

首先将json解析为对象，然后使用$.each

success: function(i){
    json = JSON.parse(i);
    $.each(json,function(index,value){
        $('#city').append('<option value="'+value.id+'">'+value.name+'</option>');
    });
}

---

显示你的回复数据json这会很有帮助好的我会更新我的帖子谢谢大家的建议。我会试试。its jQuery.eacharray，functionindex，item{}by the wayiterator在javascriptYeah中不是一个保留字，只需要很少的睡眠和咖啡因。我正在处理它：首先是P.JSON.parsei，所以它将成为object。我认为我的代码的返回值在object中。检查我的编辑，如果我是对的。我不这样认为，它在这里工作：。我只是错误地使用了变量名：POk我这样做了，但它没有追加console.logi[0].id？也没有追加。我会试着做一把小提琴。

$.ajax({
  ...
  ...
  success: function(response){
    var option = null;
    //iterate each json record
    $(response).each(function(index, record){

      //create option tag with value and record name
      option = $('<li>').attr('value', record.id).html(record.name);

      //append this option tag to select box
      $('#city').append(option);
    });
  }

});

success: function(i){
    console.log(i)
}

success: function(data){
    $.each($.parseJSON(data),function(index,value){
        $('#city').append('<option value="'+value.id+'">'+value.name+'</option>');
    });
}

success: function(i){
    json = JSON.parse(i);
    $.each(json,function(index,value){
        $('#city').append('<option value="'+value.id+'">'+value.name+'</option>');
    });
}