Question

我不认为这是重复，因为我无法在任何地方找到具体的答案。我是JavaScript的新手，无法弄清楚如何使用Ajax提取JSON信息并将其显示在我的页面上。我知道我做错了，只是不了解那些语言。

我的JSON看起来像这样：

{ "lots" : [
{
    "name" : "NE Corner HW4 & 41st",
    "info" : "$2/Hr<br>Monthly Parking Available",
    "center" : {
        "lat" : 57.659390,
        "lng" : -127.414754
    },
    "topLeft" : {
        "lat" : 57.659616,
        "lng" : -127.415102
    },
    "bottomRight" : {
        "lat" :57.659208,
        "lng" :-127.414371
    }
}, ...etc
]}

这是Ajax调用（这可能是错误的）：

var jsonFile = $.ajax({
  method: "GET",
  url: "filepath/filename.json",
  dataType: "JSON"
});

然后我需要在几个函数中使用info：

for (var i = 0; i < jsonFile.lots.length; i++) {
  marker = new google.maps.Marker({
  position: new google.maps.LatLng(jsonFile.lots[i].center.lat, jsonFile.lots[i].center.lng)
  marker.setMap(map);
}

我做错了什么（除了一切）？这是我的JSON数组吗？我需要解析或字符串化吗？也许是Ajax电话。 Javascript？我觉得这可能就是一切。谢谢你的帮助！

Answer 1

为了处理你得到的回应，你必须取得成功。实施例

$.ajax({
    url: 'Your service url',
    type: 'GET' or 'POST',
    dataType: 'json',
    success: function(response){
         //Do what ever you want with the response variable
         //Do a console.log(response) to see what is coming as the response
    }
})

根据您的示例，您可以使用以下内容。

jsonFile.done(function(response){
    //Do what ever your want with the response.
})

Answer 2

当您尝试使用它时，数据可能不存在。每个ajax调用都是异步的。试试这个：

.Div_ClientName{
    top:180px;
}
.Div_ClientName{
    position:absolute;
}
.Div_ClientName{
       left: 175px;
}
#page2{
    margin-top:200px
}

Answer 3

最好使用回调，因为它会以这种方式进行非阻塞。 JQuery还有一个getJSON函数，它将返回的字符串从Ajax调用解码为JSON，并以JSON Object作为参数调用回调。

C:\Code\ReferenceSource

请参阅https://api.jquery.com/jQuery.getJSON/

Answer 4

$.ajax({
    url: 'Your service url',
    type: 'GET',
    dataType: 'json',
    url: "filepath/filename.json",
    success: function(data){
        console.log(data);
     }
})

在Javascript中使用Ajax检索JSON数据

4 个答案: