Question

我有一个需要用户输入邮政编码的界面，然后我将根据输入的zip查询远程站点的经度和纬度，然后根据先前查询的经度和纬度查询一些人口信息。我需要3个XMLhttpRequest（）来查询三个不同的站点。每个查询都将基于先前查询的数据。我认为我的代码中可能存在一些回调问题，我不知道如何修复它。

 <input type="submit" value="Get City" onclick="getInfo()">

  <script> 
  function getInfo(getGeoCode) {
        var zipCode = document.getElementById("inputtext").value

        var xmlReq = new XMLHttpRequest();
        xmlReq.open("GET", "http://api.zippopotam.us/us/" + zipCode, true);
        xmlReq.onreadystatechange = function () {
            if (xmlReq.readyState == 4) {
                var temp = JSON.parse(xmlReq.responseText);
                var lat = temp.places[[0]].latitude ;
                var logt = temp.places[[0]].longitude;
                getGeoCode(lat, logt);
            };
        };

        xmlReq.send();
    }

    function getGeoCode(lat,logt,getpop) {
        var nereq = new XMLHttpRequest();
        nereq.open("GET", "https://data.fcc.gov/api/block/find?&latitude=" + lat + "&longitude=" + logt + "&showall=false&format=json", true);
        nereq.onreadystatechange = function () {
            if (nereq.readyState == 4) {
                var temp2 = JSON.parse(nereq.responseText);
                var stateCode = temp2.State.FIPS;
                var contyCode = temp2.County.FIPS;
                getpop(stateCode, contyCode);
            };
        };
        nereq.send();
    }

    function getpop(stateCode, contyCode) {
        var nereq2 = new XMLHttpRequest();
        nereq2.open("GET", "http://api.census.gov/data/2010/sf1?get=P0010001&for=county:" + contyCode + "&in=state:" + stateCode, true);
        nereq2.onreadystatechange = function () {
            if (nereq2.readyState == 4) {
                var temp3 = JSON.parse(nereq.responseText);
                document.getElementById("fs").innerHTML = temp3;
            };
        };
        nereq2.send();
    }
 </script>

Answer 1

您的函数的参数与您调用的函数名称冲突，因此无法再访问它们。

例如，getGeoCode有一个名为getpop的参数。调用getpop时，它不会调用该名称的函数，而是尝试调用getpop参数引用的引用。特别是因为你没有在这个paarmeter中传递任何东西，所以很可能是错误的。

解决方案是从getGeoCode移除getInfo()参数，从getpop移除getGeoCode()参数：

<input type="submit" value="Get City" onclick="getInfo()">

  <script> 
  function getInfo() {
        var zipCode = document.getElementById("inputtext").value

        var xmlReq = new XMLHttpRequest();
        xmlReq.open("GET", "http://api.zippopotam.us/us/" + zipCode, true);
        xmlReq.onreadystatechange = function () {
            if (xmlReq.readyState == 4) {
                var temp = JSON.parse(xmlReq.responseText);
                var lat = temp.places[[0]].latitude ;
                var logt = temp.places[[0]].longitude;
                getGeoCode(lat, logt);
            };
        };

        xmlReq.send();
    }

    function getGeoCode(lat,logt) {
        var nereq = new XMLHttpRequest();
        nereq.open("GET", "https://data.fcc.gov/api/block/find?&latitude=" + lat + "&longitude=" + logt + "&showall=false&format=json", true);
        nereq.onreadystatechange = function () {
            if (nereq.readyState == 4) {
                var temp2 = JSON.parse(nereq.responseText);
                var stateCode = temp2.State.FIPS;
                var contyCode = temp2.County.FIPS;
                getpop(stateCode, contyCode);
            };
        };
        nereq.send();
    }

    function getpop(stateCode, contyCode) {
        var nereq2 = new XMLHttpRequest();
        nereq2.open("GET", "http://api.census.gov/data/2010/sf1?get=P0010001&for=county:" + contyCode + "&in=state:" + stateCode, true);
        nereq2.onreadystatechange = function () {
            if (nereq2.readyState == 4) {
                var temp3 = JSON.parse(nereq.responseText);
                document.getElementById("fs").innerHTML = temp3;
            };
        };
        nereq2.send();
    }
 </script>

带有多个查询的XMLHttpRequest

1 个答案: