时间戳

首页 > 解决方案 > 异步 Ajax 调用混合回调

javascript - 异步 Ajax 调用混合回调

问题描述

所以基本上我有一个非常标准的 ajax 函数。像这样：

    function ajax_call(rest_req, url, success_callback, fail_callback) {

    // if (request_in_progress)
    //     return;

    // request_in_progress = true;
    var xhttp = new XMLHttpRequest;

    xhttp.onreadystatechange = function () {
        if (this.readyState == 4) {
            // request_in_progress = false;
            if (this.status == 200) {
                success_callback(this);
            }
            else {
                fail_callback(this);
            }
        }
    };

    xhttp.open(rest_req, url, true);
    xhttp.send();
    }

当我以这种方式使用 ajax 函数时：

(function() {
 function setup() {
   ajax_call("GET", "url1", function(xhttp) {
        response = JSON.parse(xhttp.responseText);
        if (response["error"] != 100)
            document.getElementById('url1-reading').innerHTML = '---';
        else
            document.getElementById('url1-reading').innerText = response["response"];
    },
        function() {} 
    );

    ajax_call("GET", "url2" , function(xhttp) {
        response = JSON.parse(xhttp.responseText);
        if (response["error"] != 100)
            document.getElementById('url2-reading').innerHTML = '---';
        else
            document.getElementById('url2-reading').innerText = response["response"];
    }, 
        function() {}
    );

    console.log('Refresh');

  }

   setInterval(setup, 1000);
  })();

这段代码的行为与我预期的不同。当我运行此代码时，有时应该转到 url1 success_callback 的结果会进入 url2 的 success_callback。

换句话说，url1 ajax_call 中的response变量是我希望显示为 url2 的响应变量的变量。所以实际上 ajax_call 似乎不知道success_callback 是什么，即使我明确地将它作为参数传递。

我来自 C++ 背景，所以这是一个难以掌握的概念。我该如何以正确的方式做到这一点？我希望我的问题很清楚。请告诉我什么不清楚，以便我澄清。

标签： javascriptajaxasynchronous

解决方案

您声明它的方式response是一个全局变量。尝试更改response =为let response =

推荐阅读