使用openweathermap顯示不同城市的天氣數據

我使用openweathermap爲我的網站構建了天氣小部件。 JS & HTML是 - 腳本在main.html中頁面 - >使用openweathermap顯示不同城市的天氣數據

$(function() { 

    $('.weather-temperature').openWeather({ 
     city: 'Dhaka, BD', 
     descriptionTarget: '.weather-description', 
     windSpeedTarget: '.weather-wind-speed', 
     minTemperatureTarget: '.weather-min-temperature', 
     maxTemperatureTarget: '.weather-max-temperature', 
     humidityTarget: '.weather-humidity', 
     sunriseTarget: '.weather-sunrise', 
     sunsetTarget: '.weather-sunset', 
     placeTarget: '.weather-place', 
     iconTarget: '.weather-icon', 
     customIcons: 'images/icons/weather/', 
     success: function() { 

      //show weather 
      $('.weather-wrapper').show(); 

     }, 
     error: function(message) { 

      console.log(message); 

     } 
    }); 

});

HTML - >/*

       <div class="weather-wrapper hide"> 
      <select id='list'> 
        <option value='Dhaka,BD'>Dhaka</option> 
        <option value='Pabna,BD'>Pabna</option> 
      </select> 

      <img src="" class="weather-icon" alt="Weather Icon" /> 

      <p><strong>Place</strong> 
      <br /><span class="weather-place"></span></p> 

      <p><strong>Temperature</strong> 
      <br /><span class="weather-temperature"></span> (<span class="weather-min-temperature"></span> - <span class="weather-max-temperature"></span>)</p> 

      <p><strong>Description</strong> 
      <br /><span class="weather-description capitalize"></span></p> 

      <p><strong>Humidity</strong> 
      <br /><span class="weather-humidity"></span></p> 

      <p><strong>Wind speed</strong> 
      <br /><span class="weather-wind-speed"></span></p> 

      <p><strong>Sunrise</strong> 
      <br /><span class="weather-sunrise"></span></p> 

      <p><strong>Sunset</strong> 
      <br /><span class="weather-sunset"></span></p> 

     </div>  */

沒有它正常工作了 '達卡' 城市任何 '選擇' 選項。我想用選擇選項可以更改城市名稱，並顯示改變的氣候data.I試圖------

 /* 
     var loc; 
     $('#list').change(function() { 
     loc = $('#list').val(); 
     $('.weather-temperature').openWeather({ 
      city: "' + loc + '", 
      //etc. 
     */

這裏是openweather.js代碼-----

/* 
     ;(function($) { 

$.fn.openWeather = function(options) { 

    //return if no element was bound 
    //so chained events can continue 
    if(!this.length) { 
     return this; 
    } 

    //define default parameters 
    var defaults = { 
     descriptionTarget: null, 
     maxTemperatureTarget: null, 
     minTemperatureTarget: null, 
     windSpeedTarget: null, 
     humidityTarget: null, 
     sunriseTarget: null, 
     sunsetTarget: null, 
     placeTarget: null, 
     iconTarget: null, 
     customIcons: null, 
     units: 'c', 
     city: null, 
     lat: null, 
     lng: null, 
     key: null, 
     success: function() {}, 
     error: function(message) {} 
    } 

    //define plugin 
    var plugin = this; 

    //define element 
    var el = $(this); 

    //api URL 
    var apiURL; 

    //define settings 
    plugin.settings = {} 

    //merge defaults and options 
    plugin.settings = $.extend({}, defaults, options); 

    //if city isn't null 
    if(plugin.settings.city != null) { 

     //define API url using city (and remove any spaces in city) 
     apiURL = 'http://api.openweathermap.org/data/2.5/weather?q='+plugin.settings.city.replace('', ''); 

    } else if(plugin.settings.lat != null && plugin.settings.lng != null) { 

     //define API url using lat and lng 
     apiURL = 'http://api.openweathermap.org/data/2.5/weather?lat='+plugin.settings.lat+'&lon='+plugin.settings.lng; 
    } 

    if(plugin.settings.key != null) { 

     apiURL += '&APPID=' + plugin.settings.key; 

    } 

etc.... 
    */

我我真的很抱歉這麼長時間的寫作。這個問題讓我感覺很糟糕，我不是專業編碼器。所以PLZ幫助我擺脫這個問題。

來源

2013-12-09 demo_Ashif

這可能是這麼簡單：在你的工作爲例，該市的名字是「達卡，BD」，但在你的下拉列表中，該值就是「達卡」。也許它需要國家代碼？ –

使用'達卡，BD'它的工作正常，但只爲該城市。並且請參閱標題爲「我已經嘗試」的代碼。 –

'city：''+ loc +'「，'你正在複製報價單（雙引號內的單引號） – Einacio

變化city: "' + loc + '",到city:loc,，它應該工作

來源

2013-12-09 19:46:07 Einacio

沒有兄弟，它不工作！ :( –

Thanx Einacio。我已經解決了這個問題。非常感謝 –

使用openweathermap顯示不同城市的天氣數據

回答

相關問題