我很难将Yahoo API用于天气应用程序。我试图让它显示天气信息,用于小规模测试,只是风寒。
的index.html
<head>
<title>Alex Webber - MyWeather</title>
<script language="javascript" type="text/javascript" src="js/weather"> </script>
</head>
<body>
<p id="demo"><script>weather();</script></p>
</body>
weather.js
function weather(){
var callbackFunction = function(data) {
var wind = data.query.results.channel.wind;
document.getElementById("demo").innerHTML = wind.chill;
};
}
答案 0 :(得分:0)
你必须把QUERY叫到雅虎天气api,你似乎已经把它留了出来。 查询现在设置为*,以便除风之外还可以返回其他数据。此外,在查询中分配了一个变量var位置以覆盖所有区域。使用美国前地区的州名称。纽约在城市的盒子里,纽约在乡村的盒子里。
<!DOCTYPE html>
<html>
<head>
<script>
function getLocation() {
var city = document.getElementById("city").value;
var country = document.getElementById("country").value;
var location = city + "," + country;
//create a script and add it to your page
var script = document.createElement('script');
script.src = "https://query.yahooapis.com/v1/public/yql?q=select * from weather.forecast where woeid in (select woeid from geo.places(1) where text='" + location + "')&format=json&callback=callbackFunction";
document.getElementsByTagName('head')[0].appendChild(script);
}
var callbackFunction = function(data) {
var wind = data.query.results.channel.wind;
var wind_chill = wind.chill;
var wind_speed = wind.speed;
var wind_direction = wind.direction
document.getElementById("chill").innerHTML = wind_chill;
document.getElementById("speed").innerHTML = wind_speed;
document.getElementById("direction").innerHTML = wind_direction;
//alert(wind.chill);
}
</script>
</head>
<body>
City:<input type="text" id="city">
Country/State in U.S.A<input type="text" id="country">
<input type="button" onclick="getLocation()" value="Get Weather">
<p>Wind Chill</p>
<p id="chill"></p>
<p>Wind Speed</p>
<p id="speed"></p>
<p>Wind Direction</p>
<p id="direction"></p>
</body>
</html>
贡献者Brian Glaz帮助了我,向我展示了如何将var位置分配给查询以及如何在输入数据后调用查询。