Question

我已经从W3Schools网站在本地重新创建了一个嵌入式脚本示例，但是它无法正常工作。它执行后，创建了预期的HTML页面，但是onclick激活的XHR函数并没有按预期那样更改innerHTML内容。以下是相关页面（https://www.w3schools.com/xml/tryit.asp?filename=tryxml_httprequest）中的原始代码：

<!DOCTYPE html>
<html>
<body>

<h2>Using the XMLHttpRequest Object</h2>

<div id="demo">
<button type="button" onclick="loadXMLDoc()">Change Content</button>
</div>

<script>
function loadXMLDoc() {
  var xhttp = new XMLHttpRequest();
  xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
      document.getElementById("demo").innerHTML =
      this.responseText;
    }
  };
  xhttp.open("GET", "xmlhttp_info.txt", true);
  xhttp.send();
}
</script>

</body>
</html>

我尝试了几件事：

我创建了一个本地文本文件，其名称与示例脚本中打开的名称相同，并将其放在相同的目录中。页面加载了按钮，单击时没有任何反应。
我以警报的形式向脚本添加了“跟踪器”，以确认脚本的进度：

function loadXMLDoc() {
  alert("main function successfully called");
  var xhttp = new XMLHttpRequest();
  xhttp.onreadystatechange = function() {
    alert("onreadystatechange function successfully called");
    alert("readyState: " + this.readyState + " " + "status: " + this.status);
    if (this.readyState == 4 && this.status == 200) {
      alert("readyState/status function successfully called");
      document.getElementById("demo").innerHTML = this.responseText;
    }
  };
  xhttp.open("GET", "xmlhttp_info.txt", true);
  xhttp.send();
}

执行后，前两个警报按预期出现。第三个出现两次，表明readyState从1更改为4，但两个警报的状态均保持为0。永远不会出现第四个“示踪剂”警报。

我更改了最终条件以允许“ status == 0”，并且出现了第四个警报，并且按钮消失了……什么也没替换。
可以肯定的是，我对其进行了更改，以便将字符串“ hello world”直接添加到innerHTML中，该方法可以正常工作。
我在另一个工作站上尝试了相同的变体（都在运行Ubuntu Linux btw，并且我同时使用Firefox 和 Chromium执行了代码）。

很明显，responseText空了。大概这是因为请求失败，状态保持为0而不是更改为200证明了这一点。

如果我无法使这个简单的代码正常工作，那将是非常糟糕的事情，但这是令人毛骨悚然的部分：我几天前运行了这个 same 代码示例，并且可以完美地执行。此外，我编写了一个更加复杂的脚本，利用我新发现的xhr知识来加载很多大文件，将它们的内容存储在变量中，并对它们进行搜索。 >没有任何问题。当代码失败时，我正在编写代码，起初，我认为我已经进行了更改以“破坏”它。但是当我将其回滚到越来越多的“原始”版本（我 knew 曾使用过的版本）时，我发现xhr不再起作用，而以前的可执行教程代码也不再起作用。

我不记得是否有Firefox或Chromium的临时更新可能会影响到事情，但似乎可能性很小。

我想念什么？

先谢谢了，
罗布

为什么XMLHttpRequest突然停止工作？

0 个答案: