Question

我有以下代码来获取城市的天气详情。当我加载页面时，它通过URL get方法提供给定城市的正确天气详情。但无法打印每个结果的城市名称。在我的例子中，它总是说“悉尼”

如何使用结果打印每个城市名称？

代码：

x = window.location.search.substr(6);
y = x.split("%2C");

$(document).ready(function() {
  $('#b1').click(function() {

    for (i = 0; i < y.length; i++) {

      city = y[i];

      $.ajax({
        url: 'http://api.openweathermap.org/data/2.5/weather?q=' + city +
          "&units=metric" +
          "&appid=ace585585ed8eb42338b8e663fe0170e",
        type: 'get',
        dataType: 'jsonp',
        success: function(data) {
          var w = showd(data);
          var para2 = $("<p></p>").text(city);
          var para = $("<p></p>").text(w);
          $("body").append(para2, para);
        }
      });

      function showd(data) {
        return data.weather[0].description;

      }
    }
  });
});

$(document).ready(function() {
  document.getElementById("b1").click();
});

<Script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></Script>

<button style="visibility:hidden;" id="b1">Click</button><br><br>
<p id="data"></p>
<p id="p2"></p>

网址：

file:///C:/wamp/www/aTravelz/checkweather.html?wthr=Moscow%2CLondon%2CColombo%2CSydney

结果：

Sydney

overcast clouds

Sydney

light intensity shower rain

Sydney

few clouds

Sydney

broken clouds

Answer 1

您的代码正在使用城市的最后一个值（在完成for循环之后），因为 AJAX响应将在相同之后出现。

您需要为每个 AJAX请求锁定city 的值

 (function(city){ $.ajax({
           //rest of the ajax code stays as is
 }))(city);

或者您可以使用let代替var @xander在评论中说（如演示中所示）

<强>演示

＆＃13;

var arr = [ 1,2,3 ];
for( var counter = 0; counter < arr.length; counter++ )
{
   let c = arr[ counter ];
   setTimeout( function(){
      console.log(c)
   }, 100);
}

＆＃13;

如何在JQuery中打印数组元素？

1 个答案: