javascript - 使用 jquery 在选择框中的选项中填充数据

Question

我有一个 json 数组，其中包含一些数据，我想将其所有值填充到选择框选项值中...数组就像

[
  {
    "CityId": "42231",
    "CountryID": "1",
    "RegionID": "833",
    "City": "Herat",
    "Latitude": "34.333",
    "Longitude": "62.2",
    "TimeZone": "+04:30",
    "DmaId": "0",
    "Code": "HERA"
  },
  {
    "CityId": "5976",
    "CountryID": "1",
    "RegionID": "835",
    "City": "Kabul",
    "Latitude": "34.517",
    "Longitude": "69.183",
    "TimeZone": "+04:50",
    "DmaId": "0",
    "Code": "KABU"
  },
  {
    "CityId": "42230",
    "CountryID": "1",
    "RegionID": "852",
    "City": "Mazar-e Sharif",
    "Latitude": "36.7",
    "Longitude": "67.1",
    "TimeZone": "+4:30",
    "DmaId": "0",
    "Code": "MSHA"
  }
]

我想使用 jquery 在选择框中填充这个值，我该怎么做...我已经尝试过

$.each(json, function(i, value) {
    $('#cityselect').append($('<option>').text(value.CityId).attr('value.city', value.City));
});

谁能帮我解决这个问题

Answer 1

var data = [{"CityId":"42231","CountryID":"1","RegionID":"833","City":"Herat","Latitude":"34.333","Longitude":"62.2","TimeZone":"+04:30","DmaId":"0","Code":"HERA"},{"CityId":"5976","CountryID":"1","RegionID":"835","City":"Kabul","Latitude":"34.517","Longitude":"69.183","TimeZone":"+04:50","DmaId":"0","Code":"KABU"},{"CityId":"42230","CountryID":"1","RegionID":"852","City":"Mazar-e Sharif","Latitude":"36.7","Longitude":"67.1","TimeZone":"+4:30","DmaId":"0","Code":"MSHA"}];

现在填充选项:

var $select = $('#cityselect');

$.each(data, function(i , value) {
     var option = $('<option value="'+ value.CityId+'">'+ value.City +'</option>');
     $select.append(option);
});

在性能方面甚至更好:

var data = [{"CityId":"42231","CountryID":"1","RegionID":"833","City":"Herat","Latitude":"34.333","Longitude":"62.2","TimeZone":"+04:30","DmaId":"0","Code":"HERA"},{"CityId":"5976","CountryID":"1","RegionID":"835","City":"Kabul","Latitude":"34.517","Longitude":"69.183","TimeZone":"+04:50","DmaId":"0","Code":"KABU"},{"CityId":"42230","CountryID":"1","RegionID":"852","City":"Mazar-e Sharif","Latitude":"36.7","Longitude":"67.1","TimeZone":"+4:30","DmaId":"0","Code":"MSHA"}];
var $select = $('#cityselect');
    options = [];
    $.each(data, function(i , value) {
         options.push('<option value="'+ value.CityId+'">'+ value.City +'</option>');
    });
    $select.html(options.join(""));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="cityselect"></select>