Javascript onreadystatechange函数在AJAX中不起作用

就XMLHttpRequest（）对象而言，它很好，问题在于onreadystatechange的

function process(){
    var xmlHttp = new XMLHttpRequest();

    if(xmlHttp){
        xmlHttp.onreadystatechange = function(){
            theD = document.getElementById("theD");
            if(xmlHttp.readyState == 1){
                theD.innerHTML += "Status 1: Server connection established ! <br/>";
            }
            else if(xmlHttp.readyState == 2){
                theD.innerHTML += "Status 2: Request recieved ! <br/>";
            }
            else if(xmlHttp.readyState == 3){
                theD.innerHTML += "Status 3: Processing Request ! <br/>";
            }
            else if(xmlHttp.readyState == 4){

                if(xmlHttp.status == 200){
                    var text = xmlHttp.responseText;
                    theD.innerHTML += "Status 4: Processing Request ! <br/>";
                    theD.innerHTML += text;
                }
                else{
                    alert("Something is wrong !");
                }
            }
        };
        xmlHttp.open("GET", "hello.txt", true);
        xmlHttp.send();
    }
}

它不起作用。如果我错了，请指出。

尝试使用

xmlHttp.onreadystatechange = handleServerResponse; xmlHttp.onreadystatechange=handleServerResponse； 请注意删除的妄想。

两件事：

xmlHttp.open("GET", "hello.txt", true);
xmlHttp.onreadystatechange = handleServerResponse;
xmlHttp.send();

如您所见，我删除了括号，并颠倒了

open

和

onreadystatechange

的顺序

第一件事是，否则您不会关联函数引用本身，而是关联函数的返回值——因为，基本上，您是在执行它。同样的区别是：

var a = sum(1, 2); // 3, assign to `a` the return value of `sum`
var b = sum; // assign to `b` the `sum` function ref.
var c = b(1, 2); // 3, therefore `b` is an 'alias' to `sum` 

第二件事，它取决于浏览器：例如，IE的某些版本“重置”了

XMLHttpRequest

实例的

onreadystatechange

，每次调用

open

方法。因此，如果您在

打开

之前设置

onreadystatechange

，它充当“初始化器”，则有可能在调用

打开

方法后被删除，因此永远不会调用。

---

因此，为了完全兼容，最好在

open

方法之后设置

onreadystatechange

，当然在

send

之前，使用这个

xmlHttp.onreadystatechange=handleServerResponse

---

然后作为函数handleServerResponse（xmlHttp）编写，它会工作的

我知道这有点旧，但我只是花了几个小时尝试在Chrome中使用类似的程序

我唯一能让它工作的方法就是使用

这个
对象

使用全局
xmlHttp
而不是
this
会导致
handleServerResponse（）
在
xmlHttp.readyState==2时只调用一次

以下是Google Chrome 81.0.4044.129版（官方版本）（32位）的代码

handleServerResponse（）
被调用4次，每次
xmlHttp.readyState
被递增

通过在Chrome中使用开发人员工具并监视
此
对象以及其他对象发现

function process(){
    var xmlHttp = new XMLHttpRequest();

    if(xmlHttp){
        xmlHttp.onreadystatechange = handleServerResponse;
        xmlHttp.open("GET", "hello.txt", true);
        xmlHttp.send();
    }
}

function handleServerResponse(){
    theD = document.getElementById("theD");
    if(this.readyState == 1){
        theD.innerHTML += "Status 1: Server connection established ! <br/>";
    }
    else if(this.readyState == 2){
        theD.innerHTML += "Status 2: Request recieved ! <br/>";
    }
    else if(this.readyState == 3){
        theD.innerHTML += "Status 3: Processing Request ! <br/>";
    }
    else if(this.readyState == 4){

        if(this.status == 200){
            var text = this.responseText;
            theD.innerHTML += "Status 4: Processing Request ! <br/>";
            theD.innerHTML += text;
        }
        else{
            alert("Something is wrong !");
        }
    }
}

函数过程（）{
var xmlHttp=new XMLHttpRequest（）；
if（xmlHttp）{
xmlHttp.onreadystatechange=handleServerResponse；
open（“GET”，“hello.txt”，true）；
xmlHttp.send（）；
}
}
函数handleServerResponse（）{
theD=document.getElementById（“theD”）；
if（this.readyState==1）{
theD.innerHTML+=“状态1：服务器连接已建立！
”；
}
else if（this.readyState==2）{
theD.innerHTML+=“状态2：已收到请求！
”；
}
else if（this.readyState==3）{
theD.innerHTML+=“状态3：处理请求！
”；
}
else if（this.readyState==4）{
如果（this.status==200）{
var text=this.responseText；
theD.innerHTML+=“状态4：处理请求！
”；
theD.innerHTML+=文本；
}
否则{
警惕（“有什么不对劲！”）；
}
}
}
为什么这么大惊小怪..改用
$.ajax
将其更改为-xmlHttp.onreadystatechange=handleServerResponse；你能详细说明一下为什么会这样吗？我遇到了同样的问题，但这并没有解决问题。了解这与内联函数HandleServerResponse（）不同的原因是很有用的；将是对函数的调用。在xmlHttp.onreadystatechange=handleServerResponse的情况下，您正在设置对handleServerResponse的内存地址的引用，以便其他东西可以调用它。
var a = sum(1, 2); // 3, assign to `a` the return value of `sum`
var b = sum; // assign to `b` the `sum` function ref.
var c = b(1, 2); // 3, therefore `b` is an 'alias' to `sum` 

function process(){
    var xmlHttp = new XMLHttpRequest();

    if(xmlHttp){
        xmlHttp.onreadystatechange = handleServerResponse;
        xmlHttp.open("GET", "hello.txt", true);
        xmlHttp.send();
    }
}

function handleServerResponse(){
    theD = document.getElementById("theD");
    if(this.readyState == 1){
        theD.innerHTML += "Status 1: Server connection established ! <br/>";
    }
    else if(this.readyState == 2){
        theD.innerHTML += "Status 2: Request recieved ! <br/>";
    }
    else if(this.readyState == 3){
        theD.innerHTML += "Status 3: Processing Request ! <br/>";
    }
    else if(this.readyState == 4){

        if(this.status == 200){
            var text = this.responseText;
            theD.innerHTML += "Status 4: Processing Request ! <br/>";
            theD.innerHTML += text;
        }
        else{
            alert("Something is wrong !");
        }
    }
}