Question

所以我一直在使用Dark Sky Forecast API，我能够将自己位置的天气显示在网页上。然而，我对经度和纬度进行了硬编码，我想进一步停下来，让用户自己输入。这是它停止工作的地方。

在我的代码之前只是

                <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
                <script>
                //Waits until document is ready to run
                jQuery(document).ready(function($) {
                    //Beginning of code
                    //Makes the request
                    $.ajax({
                    url : "https://api.darksky.net/forecast/MyKey/1111,-1111+?exclude=minutely,hourly,daily,alerts,flags",
                    dataType : "jsonp",
                    success : function(parsed_json) {
                    var location = parsed_json['timezone'];
                    var temp_f = parsed_json['currently']['temperature'];
                    var complete = ("Current temperature in " + location + " is: " + temp_f);
                    $('#random').html("<h1>" + complete + "</h1>")
                    }
                    });
                    }
                });

                </script>

                    $('#search').click(getInfo);
                });

                </script>

然后我创建了一些HTML字段（我使用bootstrap来保持整洁），就像这样

                        <div class="input-group input-group-lg">
                        <input id="long" type="text" class="form-control" placeholder="Longitude" aria-describedby="sizing-addon1">
                    </div>

                    <div class="input-group input-group-lg">
                        <input id="lat" type="text" class="form-control" placeholder="Latitude" aria-describedby="sizing-addon1">
                    </div>

                    <div class="rand">
                    <button class="btn btn-primary btn-lg" role="button" id="search">Find my location and temperature!</button>
                    </div>

我更新了我的脚本，看起来像这样

                     <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
                <script>
                //Waits until document is ready to run
                jQuery(document).ready(function($) {
                    //Beginning of code

                    var getInfo = function(){
                        //Grabs the longitude and latitude
                        var Longitude = $('#long').val();
                        var Latitude = $('#lat').val();
                        //Makes the request
                        $.ajax({
                        url : "https://api.darksky.net/forecast/mykey/" + Longitude + ","+ Latitude + "+?exclude=minutely,hourly,daily,alerts,flags",
                        dataType : "jsonp",
                        success : function(parsed_json) {
                        var location = parsed_json['timezone'];
                        var temp_f = parsed_json['currently']['temperature'];
                        var complete = ("Current temperature in " + location + " is: " + temp_f);
                        $('#random').html("<h1>" + complete + "</h1>")
                        }
                        });
                    }

                    $('#search').click(getInfo);
                });

但是在这一点上它只是不起作用。我点击我的按钮，没有任何反应。也许我在HTML部分做错了，因为我几乎没有对脚本做任何改动，所以我猜这不是问题。

非常感谢你！

Answer 1

没关系，明白了。我做的一切都正确，我不小心在网址上加了一个加号......哎呀。

使用字段完成API调用（Dark Sky Forecast API）

1 个答案: