Question

使用API的新手。我可以用这种方式使用像getURL这样的变量吗？这似乎接近于工作。任何帮助表示赞赏 - 谢谢！

    var location = "";
    var temp = "";
    var lat = "";
    var lon = "";
    var getURL = 'https://simple-weather.p.mashape.com/weatherdata?lat=' + lat     +'&lng=' + lon;
    var x = document.getElementById("weather");


    function getLocation() {
    if (navigator.geolocation) {
        navigator.geolocation.getCurrentPosition(showPosition);
    } else {
        x.innerHTML = "Geolocation is not supported by this browser.";
    }
}
function getPosition(position) {
    lat = position.coords.latitude; 
    lon = position.coords.longitude; 
}

function getTemp() {
  $.ajax({
    headers: {
      "X-Mashape-Key": "FPsVzvZuHhmsh0ZOssY5pNKOxIDmp1hbTH5jsnSB5VtB0f307q"
    },
    url: getURL,
    success: function(response) {
      var respond = JSON.parse(response);
      title = respond.title;
      temp = respond.temp;
      $(".titleHere").text(title);
      $(".temp").text(temp);
    }
  });
}

Answer 1

让我们把它分解成一个简单的解决方案，看看发生了什么。

var a = "1";
var b = "2";
var c = "foo " + a + b;
console.log("before", c);
a = "x";
b = "x"
console.log("after", c);

正如您所看到的，在更新变量后字符串不会更新，您需要再次构建字符串。您遇到的另一个问题是您引用变量showPosition，看起来您将其定义为getPosition。

Answer 2

提到的评论是正确的，因为您只设置一次变量，这对您的情况不起作用。这个帖子中的另一个答案很好地解释了为什么它没有被更新。

看起来你已经将getURL，lat和long封装在一个函数中。由于它在全球范围内不可用，您将无法正确分配lon＆amp; amp;使用函数getPosition（）来拉取值。

我们需要重构您的代码，以便它动态地将值分配给可访问的对象，创建一个帮助我们构成URL的辅助函数，然后在构造AJAX请求时调用该函数。下面的潜在解决方案也略有修改，以便您可以将其放入REPL进行测试：

// Generally want to avoid polluting to global scope, 
// so let's store our values into this object, config
var config = {}

function getPosition(position) {
    // getPosition will assign values
    config.lat = position.coords.latitude; 
    config.lon = position.coords.longitude; 
}

function buildUrl() {
    // using template literals to improve code readability
    const url = `https://simple-weather.p.mashape.com/weatherdata?lat=${config.lat}&lng=${config.lon}`
    return url;
}

function getTemp() {
    // notice that i replaced AJAX with this variable for testing purposes
    var test ={
    headers: {
        "X-Mashape-Key": "FPsVzvZuHhmsh0ZOssY5pNKOxIDmp1hbTH5jsnSB5VtB0f307q"
    },
    url: buildUrl(),
    success: function(response) {
        var respond = JSON.parse(response);
        title = respond.title;
        temp = respond.temp;
        $(".titleHere").text(title);
        $(".temp").text(temp);
    }
  };
  return test
}

//概念验证

var test = {
    coords: {
        latitude: 10,
        longitude: 21
    }
}

getPosition(test); // simulate the passing of coords
console.log(config) // check to see if its assigned
buildUrl()

将位置数据合并到天气API的URL中

2 个答案: