3

就 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();
    }
}

但是如果我做一个handleServerResponse()的函数

function handleServerResponse(){
    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.onreadystatechange = handleServerResponse();

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

4

4 回答 4

7

尝试使用

xmlHttp.onreadystatechange = 处理服务器响应;

注意删除的括号。

于 2013-10-19T06:54:50.770 回答
4

两件事情:

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

如您所见,我删除了括号并颠倒了openand的顺序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 会在每次调用该方法时“重置”onreadystatechange一个实例。因此,如果您在之前设置,作为“初始化器”,则有可能,取决于浏览器,一旦调用该方法,它就会被删除 - 因此永远不会被调用。所以为了完全兼容,最好在方法之后设置- 当然在.XMLHttpRequestopenonreadystatechangeopenopenonreadystatechangeopensend

于 2013-10-19T07:03:21.617 回答
1

用这个 xmlHttp.onreadystatechange = handleServerResponse

然后写为函数 handleServerResponse(xmlHttp) 它会工作

于 2013-10-19T07:15:04.690 回答
-1

我知道这有点老了,但我只是花了几个小时试图让类似的程序在 Chrome 中运行。

我可以使它工作的唯一方法是使用该this对象。

使用全局xmlHttp而不是this导致handleServerResponse()仅在 时被调用一次xmlHttp.readyState == 2

这是适用于 Google Chrome 版本 81.0.4044.129(官方构建)(32 位)的代码。

handleServerResponse()被调用 4 次,每次xmlHttp.readyState递增。

通过使用 Chrome 中的开发人员工具并监控this对象等发现。

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 !");
        }
    }
}
于 2020-05-17T02:25:45.317 回答