Question

我对这个网站很新。我在处理XMLHttpRequest时有一个问题，它在for循环中复制如下：

我不明白以下两段代码之间的区别：

function changeForm(i) {
    if (selection[i-1] != 0) {
        xmlhttp = new XMLHttpRequest();
        xmlhttp.onreadystatechange = function() {
            if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
                document.getElementById("box"+i).innerHTML = xmlhttp.responseText;
            }
        };
        xmlhttp.open("POST", "fetchLineChoice_addData.php", true);
        xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
        xmlhttp.send("index="+i+"&lc="+selection[i-1]);
    } else {
        document.getElementById("box"+i).innerHTML = "";
    }
}

for (var i = 1 ; i < 4 ; i++) {
    changeForm(i);
}

和

for (var i = 1 ; i < 4 ; i++) {
    if (selection[i-1] != 0) {
        xmlhttp = new XMLHttpRequest();
        xmlhttp.onreadystatechange = function() {
        if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
                document.getElementById("box"+i).innerHTML = xmlhttp.responseText;
            }
        };
        xmlhttp.open("POST", "fetchLineChoice_addData.php", true);
        xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
        xmlhttp.send("index="+i+"&lc="+selection[i-1]);
    } else {
        document.getElementById("box"+i).innerHTML = "";
    }
}

我真的不知道为什么第一个有效但第二个没有。我试图在网上搜索关闭并提出这两个：

Calling a XMLHttpRequest continuously

JavaScript closure inside loops – simple practical example

从第二个问题可以看出，函数绑定到函数外部的变量 i 。我想知道第二块代码（不起作用），我想知道为什么在 i 的值再次增加之前，for循环中的内容没有完全执行？执行两个代码块时的流程是什么？

非常感谢！

Answer 1

第一个有效，因为“i”的值不会被覆盖。它是“关闭”并在整个执行过程中保持不变。

在第二个示例中，迭代产生XMLHttpRequest，但“i”的全局值发生了变化。在请求完成时，它不再指向您期望的“i”值。

为什么在循环中调用XMLHttpRequest函数需要闭包？

1 个答案: