使用 jQuery 和 YQL 提取 Yahoo Weather

我正在尝试使用YQL从雅虎提取天气。但是由于某些原因，没有任何返回，但是我尝试使用 Select 语句手动调用 URL，它确实返回了我想要的结果。有人可以帮助调试我的代码出错吗？

$(function(){
    var loc1 = 'Singapore, Singapore'; // Singapore
    var u = 'c';
    var query1 = "SELECT * FROM weather.forecast WHERE woeid in (select woeid from geo.places(1) where text='" + loc1 + "' AND u='" + u + "'";
    var cacheBuster = Math.floor((new Date().getTime()) / 3600 / 1000);
    var url1 = 'https://query.yahooapis.com/v1/public/yql?q=' + encodeURIComponent(query1) + '&format=json&_nocache=' + cacheBuster;
    window['wxCallback1'] = function(data) {
        var info = data.query.results.channel;
        $('#wxIcon1').append('<img src="weathericon/' + info.item.condition.code + '.gif" width="52" height="52" title="' + info.item.condition.text + '" /><br>' + info.item.condition.text + '<br>');
        $('#wxTemp1').html(info.item.forecast[0].low + '<font style="FONT-WEIGHT:normal; FONT-SIZE:12px">&deg;' + (u.toUpperCase()) + '</font>' + ' - ' + info.item.forecast[0].high + '<font style="FONT-WEIGHT:normal; FONT-SIZE:12px">&deg;' + (u.toUpperCase()) + '</font>');
        $('#wxHum1').html(info.atmosphere.humidity + '<font style="FONT-WEIGHT:normal; FONT-SIZE:12px">%</font>');
    };
    $.ajax({
        url: url1,
        dataType: 'jsonp',
        cache: true,
        jsonpCallback: 'wxCallback1'
    });
});

设法

找到了问题。这是完整的工作代码，包括之前省略的HTML部分。请注意，条件代码表示要显示的图形文件。请参阅 https://www.igorkromin.net/index.php/2015/09/11/yahoo-weather-condition-code-to-weather-icons-font-mapping/

<!doctype html>
<html lang="en">
    <HEAD>
<META http-equiv="Page-Enter" CONTENT="RevealTrans(Duration=3,Transition=23)">
<title>selWeather</title>
</HEAD>
<body topmargin="0" leftmargin="0" style="BACKGROUND-COLOR:transparent">
<table cellpadding="1" cellspacing="1" border="0" width="194">
      <tr>
        <td colspan="2" valign="middle" bgcolor="#d0690a">
          <font style="FONT-SIZE:10px; COLOR:#ffffff; FONT-FAMILY:Arial, helvtical, verdana, tahoma">
          SINGAPORE<br>
          </font>
        </td>
      </tr>
      <tr>
        <td rowspan="3" valign="middle" align="center" width="50%">
          <font style="FONT-SIZE:10px; COLOR:#000000; FONT-FAMILY:Arial, helvtical, verdana, tahoma">
          <span id="wxIcon1"></span>
          </font><br>
        </td>
        <td valign="middle" align="center">
          <font style="FONT-SIZE:10px; COLOR:#000000; FONT-FAMILY:Arial, helvtical, verdana, tahoma">
          TEMPERATURE</font><br>
          <font style="FONT-WEIGHT:bold; FONT-SIZE:20px; COLOR:#000000">
          <span id="wxTemp1"></span>
        </td>
      </tr>
      <tr>
        <td height="1" bgcolor="#999999"></td>
      </tr>
      <tr>
        <td valign="top" align="center">
          <!-- <hr style="WIDTH: 90%; COLOR: #999999; HEIGHT: 1px"> -->
          <font style="FONT-SIZE:10px; COLOR:#000000; FONT-FAMILY:Arial, helvtical, verdana, tahoma">
          HUMIDITY</font><br>
          <font style="FONT-WEIGHT:bold; FONT-SIZE:20px; COLOR:#000000">
          <span id="wxHum1"></span></font><br>
        </td>
      </tr>
      </table>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script type="text/javascript">
$(function(){
    var loc1 = 'Singapore, Singapore'; // Singapore
    var u = 'c';
    var query1 = "SELECT * FROM weather.forecast WHERE woeid in (select woeid from geo.places(1) where text='" + loc1 + "') AND u='" + u + "'";
    var cacheBuster = Math.floor((new Date().getTime()) / 3600 / 1000);
    var url1 = 'https://query.yahooapis.com/v1/public/yql?q=' + encodeURIComponent(query1) + '&format=json&_nocache=' + cacheBuster;
    window['wxCallback1'] = function(data) {
        var info = data.query.results.channel;
        $('#wxIcon1').append('<img src="weathericon/' + info.item.condition.code + '.gif" width="52" height="52" title="' + info.item.condition.text + '" /><br>' + info.item.condition.text + '<br>');
        $('#wxTemp1').html(info.item.forecast[0].low + '<font style="FONT-WEIGHT:normal; FONT-SIZE:12px">&deg;' + (u.toUpperCase()) + '</font>' + ' - ' + info.item.forecast[0].high + '<font style="FONT-WEIGHT:normal; FONT-SIZE:12px">&deg;' + (u.toUpperCase()) + '</font>');
        $('#wxHum1').html(info.atmosphere.humidity + '<font style="FONT-WEIGHT:normal; FONT-SIZE:12px">%</font>');
    };
    $.ajax({
        url: url1,
        dataType: 'jsonp',
        cache: true,
        jsonpCallback: 'wxCallback1'
    });
});
</script>
</body>
</HTML>

相关内容

最新更新

热门标签：