如何实现天气API

Question

嗨，我想在我的应用程序之一实现天气功能。 所以为此我需要使用天气API.so任何人都可以建议我哪个天气的API和教程如何实现这个使用jQuery Mobile。

Answer 1

这里有几个解决方案，这一切都取决于你愿意走多远。你想立即显示最终结果还是你想自己解析它？

完整的解决方案

Yahoo! Weather Feed Plugin for jQuery

HTML：

<div data-role="page" id="index"> 
    <div data-theme="a" data-role="header"> 
     <h3> 
      First Page 
     </h3> 
     <a href="#second" class="ui-btn-right">Next</a> 
    </div> 

    <div data-role="content"> 
     <div id="test"></div> 
    </div> 

    <div data-theme="a" data-role="footer" data-position="fixed"> 

    </div> 
</div> 

的Javascript：

$(document).on('pagebeforeshow', '#index', function(){  
    $(document).ready(function() { 
     $('#test').weatherfeed(['UKXX0085','EGXX0011','UKXX0061','CAXX0518','CHXX0049']); 
    }); 
}); 

工作例如：http://jsfiddle.net/Gajotres/7qvJH/

Simple weather plugin

也许是最好的一个，因为你会得到可行的插件，但你可以用它来展示如何过你想要的数据，无论你想去的地方。

工作实施例（未矿）：http://jsfiddle.net/fleeting/a4hbL/

HTML：

<!-- Docs at http://simpleweather.monkeecreate.com --> 
<div id="weather"></div> 

使用Javascript：

// Docs at http://simpleweather.monkeecreate.com 
$(document).ready(function() { 
    $.simpleWeather({ 
    zipcode: '', 
    woeid: '2357536', 
    location: '', 
    unit: 'f', 
    success: function(weather) { 
     html = '<h2>'+weather.temp+'&deg;'+weather.units.temp+'</h2>'; 
     html += '<ul><li>'+weather.city+', '+weather.region+'</li>'; 
     html += '<li class="currently">'+weather.currently+'</li>'; 
     html += '<li>'+weather.tempAlt+'&deg;C</li></ul>'; 

     $("#weather").html(html); 
    }, 
    error: function(error) { 
     $("#weather").html('<p>'+error+'</p>'); 
    } 
    }); 
}); 

教程

Tutorial 1

来源：谷歌的天气饲料

这是一个简单的教程。在那里你会发现一切都可以自己做。只需要警告，它需要PHP和jQuery。

Tutorial 2

来源：雅虎天气饲料

另一个伟大的教程。它只需要jQuery。在那里，你会发现你需要做的一切，使其工作。

演示：http://demo.tutorialzine.com/2012/05/weather-forecast-geolocation-jquery/

虽然本教程有一些瑕疵（它需要你的地理位置），它可用于手动创建新的天气插件。