Javascript 在变量的范围内挣扎，无法在函数之间传递城市

我试着对它进行了很好的注释，我遇到的问题是userCity是未定义的，但我在顶部声明了它，所以我认为这使它成为一个全局变量，对吗？我试图做的是从中获取城市，然后将城市传递到getJSON以打开天气图。对不起，如果代码混乱，我是新来的。代码笔链接：

这是我的html：

<div class="main" id="temp">
        <h1>Weather!</h1>
        <h2></h2>
        <h3></h3>
        <h4></h4>
        <p></p>
        <img src="" alt="weather icon"/>
    </div>

---

您有命名冲突，请注意，我更改了回调“uc”中的一个变量名。我刚测试过，现在可以用了。试试这个

  var userCity;
  $.getJSON("http://ip-api.com/json", function(json, uc)  {
    userCity = JSON.stringify(json.city);
    userCity = city.replace(/\"/g,"");
  });

---

您有命名冲突，请注意，我更改了回调“uc”中的一个变量名。我刚测试过，现在可以用了。试试这个

  var userCity;
  $.getJSON("http://ip-api.com/json", function(json, uc)  {
    userCity = JSON.stringify(json.city);
    userCity = city.replace(/\"/g,"");
  });

---

$.getJSON是异步的，因此其余代码在该请求的回调之前执行。这里有一个方法来解决这个问题

$(document).ready(function() {
  var api = "43881a1bf31fb1b7225348b3f7839a9d";

  $.getJSON("http://ip-api.com/json", function(json)  {
    var userCity = JSON.stringify(json.city);
    userCity = city.replace(/\"/g,"");    
    makeElementsFromCity(userCity);
  });
}

function makeElementsFromCity(userCity) {
    $.getJSON("http://api.openweathermap.org/data/2.5/weather?q=" + userCity + "&units=metric&appid=" + api, function(json) {
        var name = JSON.stringify(json.name + ", " + json.sys.country);
        var temp = JSON.stringify(json.main.temp);
        var icon = JSON.stringify(json.weather[0].icon);
        var type = JSON.stringify(json.weather[0].main);
        icon = icon.replace(/\"/g,"");
        type = type.replace(/\"/g,"");
        temp = Math.round(temp);
        //update h2 with city, country and temperature and testing to see what weather.icon is but comes back as undefined
        $("#temp h2").text("The temperature in " + name + " is " + temp + "°C ");
        //updates h3 with the type of weather & city is placeholder for testing the city variable
        $("#temp h3").text(type);
        //display image of weather type from https://openweathermap.org/weather-conditions
        $("#temp img").attr("src", "http://openweathermap.org/img/w/" + icon + ".png");
      });
    });
}

---

另一方面，如果这是您文章中的实际API密钥，请重新生成它，以后不要共享它。

$。getJSON是异步的，因此其余代码在该请求的回调之前执行。这里有一个方法来解决这个问题

$(document).ready(function() {
  var api = "43881a1bf31fb1b7225348b3f7839a9d";

  $.getJSON("http://ip-api.com/json", function(json)  {
    var userCity = JSON.stringify(json.city);
    userCity = city.replace(/\"/g,"");    
    makeElementsFromCity(userCity);
  });
}

function makeElementsFromCity(userCity) {
    $.getJSON("http://api.openweathermap.org/data/2.5/weather?q=" + userCity + "&units=metric&appid=" + api, function(json) {
        var name = JSON.stringify(json.name + ", " + json.sys.country);
        var temp = JSON.stringify(json.main.temp);
        var icon = JSON.stringify(json.weather[0].icon);
        var type = JSON.stringify(json.weather[0].main);
        icon = icon.replace(/\"/g,"");
        type = type.replace(/\"/g,"");
        temp = Math.round(temp);
        //update h2 with city, country and temperature and testing to see what weather.icon is but comes back as undefined
        $("#temp h2").text("The temperature in " + name + " is " + temp + "°C ");
        //updates h3 with the type of weather & city is placeholder for testing the city variable
        $("#temp h3").text(type);
        //display image of weather type from https://openweathermap.org/weather-conditions
        $("#temp img").attr("src", "http://openweathermap.org/img/w/" + icon + ".png");
      });
    });
}

---

另一方面，如果这是您在文章中实际使用的API密钥，请重新生成它，以后不要共享它。

您正在执行ajax请求。在第一个getJSON完成之前，并且只有在成功的情况下，才会设置userCity。由于您的第二个getJSON依赖于要设置的userCity，因此应该将其移动到第一个getJSON的success方法中。在第一个getJSON完成之前，并且只有在成功的情况下，才会设置userCity。由于您的第二个getJSON依赖于要设置的userCity，因此应该将其移动到第一个getJSON的成功方法中。这并不能解决异步问题。这本身并不能解决他的问题，所以是的。否则，这应该是一个注释，而不是一个答案。这并不能解决异步问题。这本身并不能解决他的问题，所以是的。否则，这应该是一个评论，而不是一个答案。谢谢你的帮助，但我仍然在努力让这个工作。我实现了你所说的，我仍然在控制台上未定义userCity。编辑：忘记更改变量名了，非常感谢您的帮助！谢谢你的帮助，但我仍在努力工作。我实现了你所说的，我仍然在控制台上未定义userCity。编辑：忘记更改变量名了，非常感谢您的帮助！