Question

使用API创建完整的应用程序时遇到了一些问题，特别是Forecast.io weather api。为简单起见，我将我的JS直接放在我的HTML页面中。对于这个基本版本，我很高兴有这个展示的东西。假设我想要当前温度（当前 - >温度）。另外，我不确定“？回调？”始终建议所有RESTful API使用。

<!DOCTYPE html>
<html>
    <body>  
    <p id="weather">Here's the weather:<p>

    <button onclick="b()">Submit</button>
        <script>

        function b(){

            var apiKey = '<private>';
            var url = 'https://api.forecast.io/forecast/';
            var lati = 0;
            var longi = 0;
            var data;

            $.getJSON(url + apiKey + "/" + lati + "," + longi + "?callback=?", function(data) {
              $('#weather').innerHTML('and the weather is: ' + data[4].temperature);
            });
        }
        </script>

    </body>
</html>

Answer 1

你犯的主要错误是不包括jQuery :-) 下一个是在jQuery对象上，您需要使用html（）函数而不是JavaScript本机innerHTML属性。

如果使用console.log（数据），则可以看到返回对象的所有属性，因此可以正确引用它，如data.currently.temperature

<!DOCTYPE html>
<html>
    <body>
    <p id="weather">Here's the weather:<p>

    <button onclick="b()">Submit</button>
        <script>

        function b(){

            var apiKey = '<PRIVATE>';
            var url = 'https://api.forecast.io/forecast/';
            var lati = 0;
            var longi = 0;
            var data;

            $.getJSON(url + apiKey + "/" + lati + "," + longi + "?callback=?", function(data) {
              //console.log(data);
              $('#weather').html('and the temperature is: ' + data.currently.temperature);
            });
        }
        </script>

        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

    </body>
</html>

使用jQuery进行Forecast.io API使用

1 个答案: