Использование полей для завершения вызова API (API прогноза темного неба)

, поэтому я обманывал API-интерфейс Dark Sky Forecast, и я смог отобразить погоду своего местоположения на веб-странице. Однако я жестко закодировал долготу и широту, и я хотел еще раз остановиться на ней и позволить пользователю вводить свои собственные. Здесь он перестает работать.Использование полей для завершения вызова API (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-поля (я использовал самозагрузки только, чтобы держать вещи аккуратно), как этот

     <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, потому что я едва внес какие-либо изменения в сценарий, поэтому я предполагаю, что это не проблема.

Большое вам спасибо!

источник

2016-10-13 Hello Mellow