我如何获取一些API信息并将其设置为变量

时间:2019-06-13 11:53:01

标签: php jquery html ajax

当我在表单中输入城市名称时,我希望将该名称发送到Google Geocode API并获取经度和纬度。获得了纬度和经度后,我希望它作为变量发送到DarkSky API,并获取有关该位置的天气信息。问题是我无法从表单中获取与Geocode进行通讯的位置以及无法与Darksky进行通讯的Geocode。

HTML:

<form class="form" method="post" id="searchF">
<div class="search-create">
    <label class="label-search" for="location">Enter a location</label>
    <input type="text" class="form" id="location" placeholder="Location" name="location">
    <button  class="search-button" type="submit">Search</button>
</div>

    

<?php
if(isset($_POST['location']))
{
    $location = $_POST['location'];
    require 'basic.php';
    require 'allday.php';

}
?>

AJAX:

var forecastData = {
 highTemp: [],
 lowTemp: []
}

var coordinates = {
lat : [],
lng : []
}

$('#location').keyup(function(){
 var location = $('#location').val();
 $.POST('search.php',{location:location},function(data){
   $('location1').html(data);
   console.log(location);
 });
});


$.ajax({
type:"GET",
url:"https://maps.googleapis.com/maps/api/geocode/json?address="+ location + "&key=AIzaSyBBgAUwWtw5w1JMCLU59PZBqqxWZQQA-XE",
responseType:'jsonp',
success:function(data){
  coordinates.lat = data.results[0].geometry.location.lat;
  coordinates.long =data.results[0].geometry.location.lng;
  console.log(coordinates.lat);
  console.log(coordinates.long);
}
});


$.ajax({
type: "GET",
url:"https://api.darksky.net/forecast/c0b53b3f4736c755ca1a97eaa3f7efd4/" + coordinates.lat + "," + coordinates.long,
responseType:'jsonp',
success: function(data) {
  // console.log(data);

  for (i = 0; i < data.daily.data.length; i++) {
    forecastData.highTemp[i] =((data.daily.data[i].apparentTemperatureMax-32)*.5556);
    forecastData.lowTemp[i] = ((data.daily.data[i].apparentTemperatureMin-32)*.5556);
  }

1 个答案:

答案 0 :(得分:0)

尝试一下:

  var coordinates = {
lat : [],
lng : []
}

$('#location').keyup(function(){
     var location = $('#location').val();
    //  $.POST('search.php',{location:location},function(data){
    //    $('location1').html(data);
       console.log(location);

    $.ajax({
    type:"GET",
    url:"https://maps.googleapis.com/maps/api/geocode/json?address="+ location + "&key=AIzaSyBBgAUwWtw5w1JMCLU59PZBqqxWZQQA-XE",
    responseType:'jsonp',
    success:function(data){
      coordinates.lat = data.results[0].geometry.location.lat;
      coordinates.long =data.results[0].geometry.location.lng;
      console.log(coordinates.lat);
      console.log(coordinates.long);



    $.ajax({
    type: "GET",
    url:"https://api.darksky.net/forecast/c0b53b3f4736c755ca1a97eaa3f7efd4/" + coordinates.lat + "," + coordinates.long,
    responseType:'jsonp',
    success: function(data) {
      // console.log(data);

      for (i = 0; i < data.daily.data.length; i++) {
        forecastData.highTemp[i] =((data.daily.data[i].apparentTemperatureMax-32)*.5556);
        forecastData.lowTemp[i] = ((data.daily.data[i].apparentTemperatureMin-32)*.5556);
      }



           }
        });




       }
     });
//    });
});