我正在尝试获取 8 个地点的天气信息列表。我正在使用一个天气 API,它接受经度和纬度,并返回 json 输出以及该位置的天气信息。我按照 0->7 的顺序输入坐标,但是当 json 处理数据时,它会以看似随机的顺序返回。我认为这是因为某些进程比其他进程更快,并且 json 正在输出它得到的内容。输出是正确的,只是顺序错误。
var loc = null;
var body = "";
var campuses = new Array(8);
campuses[0] = "34.47242,-84.42489,1";
campuses[1] = "33.81488,-84.62048,2";
campuses[2] = "34.27502,-84.46976,3";
campuses[3] = "33.92987,-84.55065,4";
campuses[4] = "34.03433,-84.46723,5";
campuses[5] = "34.08362,-84.67115,6";
campuses[6] = "33.91124,-84.82634,7";
campuses[7] = "34.10409,-84.51804,8";
function getWeather(campusArray)
{
body += '<p class="topTitle">Campus Weather</p>';
var cSplit = new Array();
cSplit = campusArray.split(',');
var loc = "http://www.worldweatheronline.com/feed/weather.ashx?q="+cSplit[0]+","+cSplit[1]+"&format=json&num_of_days=2&key=0a05fff921162948110401&callback=?";
$('#content').html('asdf');
$.getJSON(loc,function(js)
{
var data = js.data;
var humidity = data.current_condition[0].humidity;
var tempF = data.current_condition[0].temp_F;
var iconDESC = data.current_condition[0].weatherDesc[0].value;
var iconURL = data.current_condition[0].weatherIconUrl[0].value;
var windDir = data.current_condition[0].winddir16Point;
var windSpeed = data.current_condition[0].windspeedMiles;
var tempMaxF = data.weather[0].tempMaxF;
var tempMinF = data.weather[0].tempMinF;
body += '<p class="title">'+cSplit[2]+'</p>'+
'<span class="body">'+tempF+
' '+windSpeed+
'<img src="'+iconURL+'" /></span>';
$('#content').html(body);
});
}
getWeather(campuses[0]);
getWeather(campuses[1]);
getWeather(campuses[2]);
getWeather(campuses[3]);
getWeather(campuses[4]);
getWeather(campuses[5]);
getWeather(campuses[6]);
getWeather(campuses[7]);
我也尝试过 $.ajax
var loc = null;
var body = "";
var campuses = new Array(8);
campuses[0] = "34.47242,-84.42489,1";
campuses[1] = "33.81488,-84.62048,2";
campuses[2] = "34.27502,-84.46976,3";
campuses[3] = "33.92987,-84.55065,4";
campuses[4] = "34.03433,-84.46723,5";
campuses[5] = "34.08362,-84.67115,6";
campuses[6] = "33.91124,-84.82634,7";
campuses[7] = "34.10409,-84.51804,8";
function getWeather(campusArray)
{
body += '<p class="topTitle">Campus Weather</p>';
var cSplit = new Array();
cSplit = campusArray.split(',');
var loc = "http://www.worldweatheronline.com/feed/weather.ashx?q="+cSplit[0]+","+cSplit[1]+"&format=json&num_of_days=2&key=0a05fff921162948110401&callback=?";
$.ajax({
url: loc,
async: true,
dataType: "json",
success: function(js)
{
var data = js.data;
var humidity = data.current_condition[0].humidity;
var tempF = data.current_condition[0].temp_F;
var iconDESC = data.current_condition[0].weatherDesc[0].value;
var iconURL = data.current_condition[0].weatherIconUrl[0].value;
var windDir = data.current_condition[0].winddir16Point;
var windSpeed = data.current_condition[0].windspeedMiles;
var tempMaxF = data.weather[0].tempMaxF;
var tempMinF = data.weather[0].tempMinF;
body += '<p class="title">'+cSplit[2]+'</p>'+
'<span class="body">'+tempF+
' '+windSpeed+
'<img src="'+iconURL+'" /></span>';
$('#content').html(body);
}
});
}
getWeather(campuses[0]);
getWeather(campuses[1]);
getWeather(campuses[2]);
getWeather(campuses[3]);
getWeather(campuses[4]);
getWeather(campuses[5]);
getWeather(campuses[6]);
getWeather(campuses[7]);
编辑:
json 输出示例:
{ "data": { "current_condition": [ {"cloudcover": "100", "humidity": "93", "observation_time": "04:04 PM", "precipMM": "0.0", "pressure": "1009", "temp_C": "2", "temp_F": "36", "visibility": "8", "weatherCode": "116", "weatherDesc": [ {"value": "Mist" } ], "weatherIconUrl": [ {"value": "http:\/\/www.worldweatheronline.com\/images\/wsymbols01_png_64\/wsymbol_0006_mist.png" } ], "winddir16Point": "WNW", "winddirDegree": "290", "windspeedKmph": "7", "windspeedMiles": "4" } ], "request": [ {"query": "Lat 34.47 and Lon -84.42", "type": "LatLon" } ], "weather": [ {"date": "2011-01-06", "precipMM": "9.3", "tempMaxC": "7", "tempMaxF": "45", "tempMinC": "2", "tempMinF": "35", "weatherCode": "113", "weatherDesc": [ {"value": "Sunny" } ], "weatherIconUrl": [ {"value": "http:\/\/www.worldweatheronline.com\/images\/wsymbols01_png_64\/wsymbol_0001_sunny.png" } ], "winddir16Point": "WNW", "winddirDegree": "293", "winddirection": "WNW", "windspeedKmph": "20", "windspeedMiles": "13" }, {"date": "2011-01-07", "precipMM": "0.0", "tempMaxC": "6", "tempMaxF": "44", "tempMinC": "0", "tempMinF": "31", "weatherCode": "116", "weatherDesc": [ {"value": "Partly Cloudy" } ], "weatherIconUrl": [ {"value": "http:\/\/www.worldweatheronline.com\/images\/wsymbols01_png_64\/wsymbol_0002_sunny_intervals.png" } ], "winddir16Point": "WNW", "winddirDegree": "286", "winddirection": "WNW", "windspeedKmph": "25", "windspeedMiles": "16" } ] }}
最佳答案
您需要将正在使用的 getJSON 回调修改为递归:
var loc = null, body = "", var campuses = [
"34.10409,-84.51804,8", "33.91124,-84.82634,7", "34.08362,-84.67115,6",
"34.03433,-84.46723,5", "33.92987,-84.55065,4", "34.27502,-84.46976,3",
"33.81488,-84.62048,2", "34.47242,-84.42489,1"
]; // notice they are sorted backwards
function getWeather(campusArray) {
var cSplit = [], loc;
body += '<p class="topTitle">Campus Weather</p>';
cSplit = campusArray.pop().split(','); // popping the array removes it
// from the length
/* truncated for brevity. Put your additional code here. */
$.getJSON(loc, function(js) {
/* truncated for brevity. Put your code here. */
if (campusArray.length) {
getWeather(campusArray);
}
});
}
getWeather(campuses);
关于javascript - 为什么 JSON 输出乱序?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/4617070/