Question

我正在尝试使用开放天气API建立一个为期5天的预测。我基于网站使用的参数不起作用，它返回undefined。另外，有没有办法可以从第1,2天等获得主要温度。请帮助

这是我的代码：

$.ajax({
  url: 'http://api.openweathermap.org/data/2.5/forecast', //API Call
  dataType: 'json',
  type: 'GET',
  data: {
    q: city,
    appid: key,
    units: 'metric',
    cnt: '10'
  },
  success: function(data) {
    var wf = '';
    $.each(data, function(index, val) {
      wf += '<p><b>' + data.city.name + '</b><img src=http://openweathermap.org/img/w/' + data.list[0].weather.icon + '.png></p>' + data.list[0].main.temp + '&deg;C' + ' | ' + data.list[0].weather.main + ", " + data.list[0].weather.description
    });
    $("#showWeatherForcast").html(wf);
  }
});

Answer 1

在网址中尝试此操作并删除数据属性

'http://api.openweathermap.org/data/2.5/forecast?appid='+key+'&q='+city+'&count=10'

我无法在没有api密钥的情况下进行测试，但文档几乎告诉您该怎么做http://openweathermap.org/forecast5

Answer 2

您当前的代码并不太远。我建议您在console.log(data)函数中使用success来查看测试时弹出的内容。它将帮助您理解返回的数据结构。

如果您现在查看浏览器控制台，您可能会看到一些警告。我建议您对主API调用和图片网址使用https而不是http网址，以避免其中一些，包括混合内容警告。

以下代码改编自您的代码，并在val的{{1}}中显示每个data.list的温度，说明和图标。请注意，city此处循环遍历数组$.each中每个val（0-9）的属性，以访问您需要的数据。您当前的代码每次都会尝试访问data.list val，并返回data.list[0][some property]。

undefined

使用开放天气api AJAX和JS构建5天预报

2 个答案: