如果我知道另一个属性的值属于 JSON 中的同一对象，有没有办法选择一个属性的值？

Question

我有一个 geoJSON 文件，我必须使用它来填充一个下拉框，显示用户可以选择的国家/地区列表（按名称）。为了让我能够从 API 获取信息以显示所选国家/地区的人口、面积、天气、时区等，我需要向 API php 调用提供正确的值。我需要从 geoJSON 中提取国家/地区代码以及纬度和经度。

geoJSOn 是大约 200 多个国家/地区的数据。 geoJSON 文件结构示例：

{"type": "featureCollection", "features": 
[{"type": "Feature", "properties": {"name": Bahamas", "iso_a2":"BS", "iso_a3": "044"}, "geometry": {"type": "Multipolygon", "coordinates": [[ etc ]]}, {"type": "Feature", "properties": {"name": Mexico", "iso_a2":"MX", "iso_a3": "484"}, "geometry": {"type": "Multipolygon", "coordinates": [[ etc ]]}, {"type": "Feature", "properties": {"name": Trinidad and Tobago", "iso_a2":"TT", "iso_a3": "780"}, "geometry": {"type": "Multipolygon", "coordinates": [[ etc ]]}, so and so forth }

我设法让下拉菜单填充国家/地区名称列表，但在 HTML 中设置选项的值并不容易。

由于无法按照与国家/地区名称相同的顺序简单地提取 iso_a2，因此我得到的数据不匹配。我使用了 sort()、filter()，并创建了一个新的 iso_a2 列表，但仍然不匹配。以阿富汗为例，它是第一个国家，它的国家代码是AE，而本应是AF。

这是我的查询的后续内容 在 HTML 下拉框中填充 JSON 文件中存储的国家/地区数据列表。 PHP/Javascript/AJAX - 获取双值且未排序

我尝试使用 .php 来处理 ajax 调用，但当我尝试运行代码时出现“非法调用”错误。

我已经连续尝试了超过 14 个小时，但无法解决此问题。我什至尝试使用类，但我无法想出任何有建设性的东西。我只是希望得到一个关于如何组织国家代码以与国家名称相匹配的解决方案。

任何提示或线索将不胜感激！

]()

//编辑以下部分：

为了清楚起见，我已包含有问题的代码：

$.getJSON("./countryBorders.geo.json", function(data) {
    const result = data['features'];
    let countryNames = [];
    let iso_a2 = [];
   
    for (let i = 0; i < result.length; i++) {
        let name = result[i]['properties']['name'];
        let countryIso = result[i]['properties']['iso_a2'];

    //const entries = Object.entries(result[i]['properties']);
     //console.log("Entries", entries);
/* I tried Object.entries() but it only gave me the values in key:value arrays.  Entries: {["name": "Argentina"], ["iso_a2": "AR"], [etc], [etc] } */
    
        countryNames.push(name);

        iso_a2 = iso_a2.filter(x => isNaN(x));
        iso_a2.sort().push(countryIso);
    } 
   
    for (let i = 0; i < countryNames.length; i++) {
        
        countryNames.sort();
    }
        $('#countrySelect').append($('<option></option>')
            .val(iso_a2[i])
            .html(countryNames[i])
         );
    }
        
 

<span id="selectContainer">
  <select id="countrySelect" class="form-select shadow-sm">
    <!-- populate from PHP call that returns only the codes and names from the countryborder GeoJSON file -->
   
   <option id="select" value="">Select a country</option>
  </select>
</span>

]

Answer 1

好的，我明白了。在连续花了23个小时之后。我现在必须在这里回答我自己的问题，否则当我找到解决方案时，我可能会无意中导致其他人不得不花费宝贵的时间来思考这个问题。 :)

答案：

$.getJSON("./countryBorders.geo.json", function(data) {
    const result = data['features'];
    let countryNames = [];
    let iso_a2 = [];
     
    for (let i = 0; i < result.length; i++) {
        let name = result[i]['properties']['name'];
        let countryIso = result[i]['properties']['iso_a2'];
 
    countryNames.push(name);
    iso_a2.push(countryIso);
}

    for (let i = 0; i < countryNames.length; i++) {
        
        $('#countrySelect').append($('<option></option>')
            .val(iso_a2[i])
            .html(countryNames[i])
          );
    
    var options = $("#countrySelect option");        
    options.detach().sort(function(a,b) { 
                var at = $(a).text();
                var bt = $(b).text();         
            return (at > bt) ? 1 :((at < bt) ? -1 : 0);
        });
        options.appendTo("#countrySelect"); 
    }                     
});

诀窍是不要尝试分别对国家/地区名称和国家/地区代码进行排序，否则我会得到名称和代码不匹配的结果，如上面所附图片所示。解决方案是仅在传播后才对列表进行排序。