2013-12-25 4 views
-4

Я создал сценарий для отображения погоды на моем сайте, моя проблема, когда я его выполняю, ничего не отображает.почему мой сценарий не отображает погоду

это мой сценарий:

<!DOCTYPE html> 
<html> 
<head> 
<title>Weather API Test</title> 
</head> 
<body> 
<script type="text/html" id="weather_tmpl"> 
    <div class="weather_wrapper"> 
     <div class="top_wrapper top_wrapper_e"> 
      {{=day0}} 
      <div class="bt_control" id="meteo_controller"> 
       <a href="javascript://"> 
        <img src="arrow_open.png" id="meteo_trigger_img" width="27" height="17" alt="Arrow" /> 
       </a> 
      </div> 
     </div> 
     <div class="bottom_wrapper" id="meteo_future_days"> 
      <div class="next_days_wrapper"> 
       <div class="day first"> 
        {{=day1}} 
        <div class="clear"></div> 
       </div> 
       <div class="day"> 
        {{=day2}} 
        <div class="clear"></div> 
       </div> 
       <div class="day last"> 
        {{=day3}} 
        <div class="clear"></div> 
       </div> 
      </div> 
      <div class="bottom"></div> 
     </div> 
    </div> 
</script> 

<script type="text/html" id="detail_tmpl"> 
    <div class="date">{{=date.weekday}}, 
     <br />{{=date.day}} {{=monthname_short}}.</div> 
    <div class="temp">{{=high.celsius}}</div> 
    <div class="icon"> 
     <img src="{{=icon_url}}" width="34" height="34" alt="icone" /> 
    </div> 
</script> 

<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script> 
<script src="t.min.js"></script> 

<script type='text/javascript'> 
    (function(){ 
     var mainTpl = new t($('#weather_tmpl').html()), 
      detailTpl = new t($('#detail_tmpl').html()); 

$.getJSON('http://api.wunderground.com/api/2ea138a9dd52eabe/forecast/q/CA/San_Francisco.json') 
      .done(function(data){ 
       var tplData = {}; 
       $.each(data.forecast.simpleforecast.forecastday, function(index, day){ 
        tplData['day'+index] = detailTpl.render(day); 
       }); 
       $('body').append(mainTpl.render(tplData)); 
      }); 
    })(); 
</script> 
    <script> 
      var meteostatus = 0; // closed 
      $('#meteo_controller').click(function() { 
      if (meteostatus == 0) { 
      meteostatus = 1; 
      $('#meteo_future_days').fadeIn('slow'); 
      $('#meteo_trigger_img').attr('src', $('#meteo_trigger_img').attr('src').replace('open', 'close')); 
      } else { 
      meteostatus = 0; 
      $('#meteo_future_days').fadeOut('slow'); 
      $('#meteo_trigger_img').attr('src', $('#meteo_trigger_img').attr('src').replace('close', 'open')); 
      } 
      }); 
     </script> 
</body> 
</html> 

PS:

Данные за текущий день, а также прогноз на ближайшие 3 находятся в data.forecast.simpleforecast.forecastday массива.

Я использовал библиотеку шаблонов под названием t.js, которые вы можете найти here

имеют хороший день

+0

't' не определен. Кроме того, используйте '===' для сравнения с 0. Для всех этих людей, [скрипка.] (Http://jsfiddle.net/7c7RS/) – Cilan

+0

вы хотите, чтобы мы загрузили библиотеку, чтобы выяснить, что неправильно? –

+0

@EdHeal Я понял, что было не так с 'try' и' catch' – Cilan

ответ

0

Заменить два ваших scripts (один с идентификатором library и один с t.min.js) с:

<script src="https://github.com/jasonmoo/t.js/blob/master/t.min.js" /> 
<script type="https://github.com/jasonmoo/t.js/blob/master/template" id="test"> 
(function(){ 
     var mainTpl = new t($('#weather_tmpl').html()), 
      detailTpl = new t($('#detail_tmpl').html()); 

$.getJSON('http://api.wunderground.com/api/2ea138a9dd52eabe/forecast/q/CA/San_Francisco.json') 
      .done(function(data){ 
       var tplData = {}; 
       $.each(data.forecast.simpleforecast.forecastday, function(index, day){ 
        tplData['day'+index] = detailTpl.render(day); 
       }); 
       $('body').append(mainTpl.render(tplData)); 
      }); 
    })(); 
      var meteostatus = 0; // closed 
      $('#meteo_controller').click(function() { 
      if (meteostatus === 0) { 
      meteostatus = 1; 
      $('#meteo_future_days').fadeIn('slow'); 
      $('#meteo_trigger_img').attr('src', $('#meteo_trigger_img').attr('src').replace('open', 'close')); 
      } else { 
      meteostatus = 0; 
      $('#meteo_future_days').fadeOut('slow'); 
      $('#meteo_trigger_img').attr('src', $('#meteo_trigger_img').attr('src').replace('close', 'open')); 
      } 
      }); 

</script> 

Вы пытались поставить SRC скрипт в качестве локального пути на сервере, где файл уже размещен на GitHub.

Кроме того, есть ошибка сценария.

+0

thank вы за ответ, но вы не ответили на мой вопрос, моя проблема: я хочу отображать погоду на своем сайте, а сценарий ничего не отображает. –

+0

Что мне делать, чтобы получить погоду на моем сайте, используя этот скрипт? и спасибо –

+0

где я могу найти идентификатор библиотеки –

Смежные вопросы