2013-12-09 5 views
0

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>  */ 

는 '다카'도시를 제대로 작동 어떤 '선택'옵션을 사용하지 않으면 . -----

다음
 /* 
     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.... 
    */ 

I를 내가 선택 옵션을 사용하여 도시 이름을 변경하려면 변경할 날씨 data.I는 시도 보여 이 긴 글에 대해 정말 유감입니다. 이 문제는 나를 심하게 괴롭 히고 나는 프로 코더가 아닙니다. 그래서 plz이 문제에서 나갈 수 있도록 도와주세요.

+0

처럼 간단 할 수 있습니다 작동합니다 : 당신의 일 예에 는, 도시의 이름이 "다카, BD"입니다,하지만 당신의 드롭 다운에, 값은 "단지 다카입니다 ". 아마도 국가 코드가 필요할까요? –

+0

'Dhaka, BD'가 제대로 작동하지만 해당 도시에서만 사용합니다. 그리고 plz는 '나는 시도했습니다.'라는 제목의 코드를 보았습니다. –

+0

'city : " '+ loc +'", '큰 따옴표 안에 큰 따옴표를 넣으려고합니다. – Einacio

답변

0
city:loc,

변화 city: "' + loc + '",하고

+0

동생이 아니고, 작동하지 않습니다! :( –

+0

Thanx Einacio. 문제를 해결했습니다. Thnk u very much –