无法解析来自 Weather Underground API 的 JSON 响应

Question

我正在尝试创建一个简单的天气页面。我想检索用户位置的坐标，然后从 Weather Underground API 检索位置的天气信息。我能够看到我的坐标的 JSON 响应。但是，我在使用 AJAX 函数解析 JSON 并将其显示在 HTML 上时遇到问题。下面是我的代码

HTML:

<div class="container-fluid text-center">
<body>
<div id="forecast">
<h1>Weather at <span id="location"> </span></h1>
<div id="imgdiv">
<img id="img" src=""/>
</div>
<p>It is currently <span id="temp"> </span>°C with <span id="desc"> </span></p>
<p>Wind: <span id="wind"></span></p>

</body>
</div>

JQuery;

    var Geo={};
     var temp_f
        //var key = ‘4d6eb96f1aa092b2’;

        if (navigator.geolocation) {
        navigator.geolocation.getCurrentPosition(success,error);
        }
        else {
        alert('Geolocation is not supported');
        }

        function error() {
        alert("That's weird! We couldn't find you!");
        }

   function success(position) {
              Geo.lat = position.coords.latitude;
              Geo.lng = position.coords.longitude;
              Geo.url   = "http://api.wunderground.com/api/4d6eb96f1aa092b2/forecast/geolookup/conditions/q/" + Geo.lat + "," + Geo.lng + ".json"; 

     $.ajax({
    url : Geo.url,
    dataType : "json",
    success : function(url) {
         location = url['location']['city'];
         temp_f = url['current_observation']['temp_f'];
        $("#temp").html(temp_f);
    }
   });

}

我得到位置和 temp_f 值 undefined。我提到了非常相似 post 但无法弄清楚问题是什么？我是新来的所以如果缺少一些基本的东西请原谅。

Answer 1

它对我来说工作正常检查：https://jsfiddle.net/jigarb1992/q1w8usq9/

我在您的代码中发现的问题可能出在这里 location = url['location']['city'];，javascript 中的 location 会将您重定向到指定位置。

试试我在 jsfiddle

中做修改的代码

无法解析来自 Weather Underground API 的 JSON 响应

Not able to parse JSON response from Weather Underground API

ajax

geolocation

weather-api