在这段代码中，我试图提供用户位置和当地温度，但不知何故，温度显示的摄氏度要低得多，而且下面也没有更新，这是我尝试过的，就像 4-5 小时返回的数据少了 10 摄氏度就像如果温度是 22（摄氏度）小时，它会显示为 3（摄氏度），在 codepen 上工作示例http://codepen.io/cannelflow/full/RrymYo/
var x = document.getElementById("demo");
var y = document.getElementById("demo1");
window.onload = getLocation();
//window.onload=getWeather();
function getLocation() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showPosition, showError);
} else {
x.innerHTML = "Geolocation is not supported by this browser.";
}
}
//Location For Display
function showPosition(position) {
var loc = { lat: position.coords.latitude, lon: position.coords.longitude };
getWeather(loc);
var baseURL = "https://maps.googleapis.com/maps/api/geocode/json?latlng=";
var fullURL = baseURL + loc.lat + "," + loc.lon;
$.ajax({
url: fullURL,
success: function (display) {
x.innerHTML = display.results[1].formatted_address;
}
});
}
//Location For Weather
function getWeather(loc) {
var baseURL = "http://api.openweathermap.org/data/2.5/weather?lat=";
var appid = "064129b86c99c35c42d531db251b99e3";
var fullURL = baseURL + loc.lat + "&lon=" + loc.lat + "&appid=" + appid + "&units=metric";
//http://api.openweathermap.org/data/2.5/weather?lat=21.2600668&lon=81.5989561&appid=064129b86c99c35c42d531db251b99e3&units=metric
$.ajax({
url: fullURL,
success: function (display1) {
y.innerHTML = display1.main.temp;
}
});
}
function showError(error) {
switch (error.code) {
case error.PERMISSION_DENIED:
x.innerHTML = "User denied the request for Geolocation."
break;
case error.POSITION_UNAVAILABLE:
x.innerHTML = "Location information is unavailable."
break;
case error.TIMEOUT:
x.innerHTML = "The request to get user location timed out."
break;
case error.UNKNOWN_ERROR:
x.innerHTML = "An unknown error occurred."
break;
}
}<body>
<section>
<div class="container-fluid text-center">
<br />
<!-- <h1><button class="btn btn-danger" onclick="getLocation()">Click Me To Get Your Location!</button></h1> -->
<h1 class="text-primary" id="demo1"></h1>
<br />
<h1 class="text-primary" id="demo"></h1>
</div>
</section>
</body>您打错字了：
var fullURL = baseURL + loc.lat + "&lon=" + loc.lat + "&appid=" + appid + "&units=metric";
应该是
var fullURL = baseURL + loc.lat + "&lon=" + loc.lon + "&appid=" + appid + "&units=metric";
您的查询字符串中有拼写错误。更好的替代方案是用户
jQuery.paramfunction getWeather(loc) {
var baseURL = "http://api.openweathermap.org/data/2.5/weather?";
return $.ajax({
url: baseURL + $.param({
appid: "064129b86c99c35c42d531db251b99e3",
lon: loc.lon,
lat: loc.lat,
units: "metric"
}),
success: function(display1) {
y.innerHTML = display1.main.temp;
}
});
}
修改为
function getWeather(loc) {
var baseURL = "http://api.openweathermap.org/data/2.5/weather?lat=";
var appid = "064129b86c99c35c42d531db251b99e3";
//var fullURL = baseURL + loc.lat + "&lon=" + loc.lat + "&appid=" + appid + "&units=metric";
//http://api.openweathermap.org/data/2.5/forecast?lat=35&lon=139&appid=44db6a862fba0b067b1930da0d769e98&units=metric
$.ajax({
url: baseURL,
type: 'get',
dataType: 'JSONP',
data: { lat: loc.lat, lon: loc.lon, units: 'metric', APPID: appid },
success: function (data) {
y.innerHTML = data['main']['temp'] + " °C";
}
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>它起作用了