Question

下面是我的jquery代码和一些html。我正在使用两个API调用。一个到http://ip-api.com/json，另一个到http://api.openweathermap.org/data/2.5/weather，以帮助我显示当地的天气。它不起作用。有人可以帮忙吗？

function getLocation(data) {
// Function to work with Location API to get Longitude, Latitude, City and State to be used with the weather API
var lat = data.lat
var lon = data.lon
var city = data.city
var state = data.regionName
var appid = '41362d72ffa232cbf07f864db3a8f8e7';
// Custom url for the weather API, it is only missing imperial or metric format.
url = 'http://api.openweathermap.org/data/2.5/weather?' + 'lat=' + lat + '&lon=' + lon + '&units=' + units + '&appid=' + appid;
};

var units = 'imperial'
// Function to get the Weather info and display it.
function getWeather(data) {
var temp = data.main.temp
var tempUnit = units === 'metric' ? 'C' : 'F'
var windUnit = units === 'metric' ? ' meters/s' : ' miles/h'
var description = data.weather[0].description
var code = data.weather[0].icon
var wspeed = data.wind.speed
// Create custom HTML to display all the information gathered.
var html = '<img src="http://openweathermap.org/img/w/' + code + '.png" alt="Weather Icon">' + '<p> ' + Math.round(temp) + ' ' + tempUnit + ', ' + description + '<br> Wind Speed: ' + wspeed + windUnit + '</p><p>' + city + ', ' + state + '</p>'
// Displays the custom HTML
$('.message').html(html)
};

// When the documet finished loading call the Location API
$(document).ready(function () {
$.getJSON('http://ip-api.com/json', getLocation, 'jsonp')
// Handler for option between Metric and Imperial style temperature
$('input[type=radio][name=farenheit-celcius]').change(function () {
if ($('#f').is(':checked')) {
  units = 'imperial'
} else {
  units = 'metric'
}
$.getJSON(url + units, getWeather, 'jsonp')
});
});

有点html -

<div class = "col-xs-12 well message">
  <h3>The Temperaure</h3>
</div>
</div>
<div class = "row text-center">
<div class = "col-xs-12">
 <form action="/select-metric">
    <label>
      <input type="radio" name="farenheit-celcius" id="f"> Farenheit</label>
    <label>
      <input type="radio" checked name="farenheit-celcius" id="c"> Celsius</label>
  </form>

 </div>

API调用jsonp在jquery中不起作用

0 个答案: