jquery - 使用 jquery、ajax、json 和谷歌地图获取街道名称

Question

我试图从一组坐标中获取街道的名称。我可以将如下所示的 URL 粘贴到我的浏览器中，以获取 JSON 格式的数据。

http://maps.googleapis.com/maps/api/geocode/json?latlng=36.061637909151614,14.215711886063218&sensor=false

但是，在将返回的数据存储在变量中然后提取我感兴趣的特定参数的值时，我遇到了困难，在本例中为 results/address_components/long_name。

我找到了将页面中的代码读入元素的示例，还找到了解析 JSON 的代码，但我不知道如何将它们放在一起以获得最终结果，即包含街道名称的字符串。

任何帮助将不胜感激。

Answer 1

演示

var longName;
$.getJSON('http://maps.googleapis.com/maps/api/geocode/json?latlng=36.061637909151614,14.215711886063218&sensor=false',function(data){
    longName = data.results[0].address_components[0].long_name;
});

$('button').on('click',function(){
    alert(longName);
});

Answer 2

您可以使用getJSON()方法执行此操作：

var url = "http://maps.googleapis.com/maps/api/geocode/json?latlng=36.061637909151614,14.215711886063218&sensor=false";

$.getJSON(url, function (json) {
    //console.log("JSON Data: " + json.results);
    $.each(json.results, function (index, value) {
        $.each(value.address_components, function (index, value) {
            console.log(index + ': ' + value.long_name);
        });
    });
});

小提琴演示