将JSON文件中的数据提取到Javascript中，作为web表单输入中的自动完成

我不经常使用Javascript，因此我的知识非常有限

我有一个JSON文件airports.JSON，其中列出了机场iata代码、名称、城市和国家：

[
{
    "iata": "CPT",
    "name": "Cape Town International Airport",
    "city": "Cape Town",
    "country": "South Africa"
},

{
    "iata": "JNB",
    "name": "OR Tambo International Airport",
    "city": "Johannesburg",
    "country": "South Africa"
},

{
    "iata": "DUR",
    "name": "King Shaka International Airport",
    "city": "Durban",
    "country": "South Africa"
},
]

我想使用这些信息在一个Javascript文件method.js中提取它，该文件获取信息并解析它以返回给用户。当用户开始键入IATA代码、城市或国家时，脚本文件必须搜索不同的变量IATA、名称、城市、国家，并在自动完成下拉框中编译结果，如下所示：

city + ', ' + name + '(' + iata + '), ' + country,

city + '(' + iata + ')' 

开普敦，开普敦国际CPT，南非

或者用这样的编码术语：

city + ', ' + name + '(' + iata + '), ' + country,

city + '(' + iata + ')' 

但当用户单击结果[onSelect]时，输入字段必须只有以下内容：

开普敦CPT

或者，用类似这样的编码术语：

city + ', ' + name + '(' + iata + '), ' + country,

city + '(' + iata + ')' 

---

如何将.json文件中的信息输入到.js文件中，并使用它自定义生成自己的结果？

第一部分是使用ajax获取数据。因为它是一个静态数据文件，所以在ajax回调中加载一次，初始化autocomplete并将数据数组传递给插件

$.getJSON('yourdata.json', function(response){
    var mappedData = $.map(response , function(){ /* up to you to map it*/ })
    $('.airportFrom input').autocomplete({
        lookup: mappedData ,
        .......
    });

    // other autocomplete
});

---

由于您使用的是JQuery，因此可以使用$.getJSON方法从airports.json文件中检索json数据

记住将自动完成代码放在success函数中，这样代码只会在ajax调用完成后运行。比如：

$.getJSON("/airports.json")
.success(function( data ) {
    var airportArray = data; // here you get your airport.json data and assing it to your array variable. The data will already be in json format
    // HERE YOU PUT YOUR AUTOCOMPLETE CODE SO YOU CAN USE THE DATA RETRIVIED
})
.error(function(){
    // here you handle the error with the ajax call (doc does not exist, the server does not respond...
});

---

使用JSON.parse将JSON数据解析为js对象