Javascript 除了Ajax，一切都正常_Javascript_Ajax_Openweathermap

Javascript 除了Ajax，一切都正常

javascript ajax

Javascript 除了Ajax，一切都正常,javascript,ajax,openweathermap,Javascript,Ajax,Openweathermap,调用OpenWeatherAPI。当我将URL输入浏览器时，我可以看到JSON对象。但是，我下面的ajax不允许任何内容出现在我的HTML中。即使我想要document.write整个json对象，我也不能。我可以输出lat和long，以便地理定位工作正常。不确定这个代码有什么问题以下是HTML： <body> <div class="container"> <div class="col-lg-12 header"> <h1>M

调用OpenWeatherAPI。当我将URL输入浏览器时，我可以看到JSON对象。但是，我下面的ajax不允许任何内容出现在我的HTML中。即使我想要document.write整个json对象，我也不能。我可以输出lat和long，以便地理定位工作正常。不确定这个代码有什么问题

以下是HTML：

<body>
  <div class="container">
  <div class="col-lg-12 header">
    <h1>My Location</h1>
  </div>
    <div class="row text-center box">
      <div class="col-lg-12" id="data">Lat Long</div>
    </div>
  </div>
</body>

问题不在ajax调用中

您的代码似乎可以很好地处理硬编码的坐标，并且在除Chrome之外的所有其他浏览器上都可以以当前的形式工作

如果你想在新版谷歌浏览器上使用地理定位，你的主机必须是安全的（HTTPS）

铬警告：

getCurrentPosition（）和watchPosition（）在不安全的源上不推荐使用。要使用这个特性，您应该考虑将应用程序切换到安全的原点，例如HTTPS。有关更多详细信息，请参阅

问题不在ajax调用中

您的代码似乎可以很好地处理硬编码的坐标，并且在除Chrome之外的所有其他浏览器上都可以以当前的形式工作

如果你想在新版谷歌浏览器上使用地理定位，你的主机必须是安全的（HTTPS）

铬警告：

尝试

$.getJson

而不是

$.ajax

：


$.getJSON（{
数据类型：“jsonp”，
url:api，
成功：功能（数据）{
city=data.name；
$（“#数据”）.html（城市）；
}

在HTML中，确保添加jquery：

//无论您的js文件名是什么

在不修改代码的情况下，页面请求访问我的位置，然后显示我的当前城市。但我不确定它应该输出什么。您希望输出是什么？

尝试

$。getJson

而不是

$。ajax

：


$.getJSON（{
数据类型：“jsonp”，
url:api，
成功：功能（数据）{
city=data.name；
$（“#数据”）.html（城市）；
}

在HTML中，确保添加jquery：

//无论您的js文件名是什么

在不修改代码的情况下，页面请求访问我的位置，然后显示我的当前城市。但我不确定它应该输出什么。您希望输出是什么？

控制台中是否有关于跨域请求的错误？控制台中是否有关于尝试从HTTPS访问HTTP的错误？（说真的，在询问之前，您需要查看控制台以查看错误消息）.我没有收到您需要使用的控制台错误消息jsonp@Andy-这似乎不太可能，但如果是这样，则添加错误处理程序和成功处理程序。请参阅jQuery对此的说明。同时添加console.log语句以确保主函数正在运行。控制台中是否有关于跨域请求的错误？您在控制台中是否遇到了试图从HTTPS访问HTTP的错误？（说真的，在询问之前，您需要查看控制台以查看错误消息）.我没有收到您需要使用的控制台错误消息jsonp@Andy-这似乎不太可能，但如果是这样，则添加一个错误处理程序和一个成功处理程序。请参阅jQuery对此的说明。还要添加console.log语句以确保主函数正在运行。我希望城市是输出。您的代码工作正常吗n Chrome？我只是尝试了一下，运气不好。这是JSFIDLE：是的，它与Chrome和Firefox一起工作。在HTML中，我添加了：

。也许你的脚本有问题，jquery在你的js文件之前被引用了吗？谢谢。它在Safari中工作，但在Chrome中没有。这将在Chrome中归因于一个可能的地理位置问题。但是从.ajax更改为.getJSON确实有效。假设这是因为数据是json格式的，不需要使用ajax？因此我遇到了两个问题。如果将JSFIDLE切换到http链接并测试代码，您将得到与chrome navigator相关的以下错误：getCurrentPosition（）和watchPosition（）使用这个特性，你应该考虑把你的应用程序切换到一个安全的原点，比如HTTPS。查看链接以获得更多的细节。因此，如果你在HTTPS页面上尝试使用HTTP API请求，那么你可以切换它，并注意Chrome不喜欢它。你会得到一个混合内容消息…听起来像Y。您需要https API（更安全的API）。我使用JQuery 3.0.0进行测试。我认为最终在使用chrome的地理定位功能时，您不能使用http api，因为该功能需要https。因此，您将遇到我遇到的两个问题之一。我希望城市成为输出。您的代码在chrome中工作吗？我只是尝试了一下，没有成功。下面是jsfiddle：是的，这在Chrome和Firefox中都有效。在HTML中，我添加了：

。也许你的脚本有问题，jquery在你的js文件之前被引用了吗？谢谢。它在Safari中有效，但在Chrome中不起作用。这要归因于Chrome中可能存在的地理位置问题。但是你从.ajax改为.getJSON肯定有效d、假设这是因为数据是json格式的，不需要使用ajax？因此我遇到了2个问题。如果您将JSFIDLE切换到http链接并测试代码，您将得到与chrome navigator相关的以下错误：getCurrentPosition（）和watchPosition（）使用这个特性，你应该考虑把你的应用程序切换到一个安全的原点，比如HTTPS。查看链接以获得更多的细节。因此，如果你尝试使用HTTP API请求，那么你可以切换它，并注意Chrome不喜欢它。

$(document).ready(function() {
  if (navigator.geolocation) {
    navigator.geolocation.getCurrentPosition(main); 
  }
});
function main(position){
  var lat = position.coords.latitude;
  var long = position.coords.longitude;
  var api = "http://api.openweathermap.org/data/2.5/weather?lat=" + lat      + "&lon=" + long + "&appid=[redacted key]";
  $.ajax({
    dataType: 'json',
    url: api,
    success: function(data) {
        city = data.name;
        $("#data").html(city);
    }
  });
}