XMLHttpRequest (Ajax) Error

Question

我在JavaScript中使用XMLHttpRequest。然而，它给了我一个错误，我不知道我的问题是什么。
我必须解析一个XML文件并将其内容分配给网页——这是我的代码：

<script = "text/javascript">
    window.onload = onPageLoad();
    var questionNum = 0;
    function onPageLoad(questionNum) {
        var xmlhttp = new XMLHttpRequest();
        xmlhttp.open("GET","quiz.xml");
        try {
            xmlhttp.send(null); // Here a xmlhttprequestexception number 101 is thrown 
        } catch(err) {
            document.getElementById("body").innerHTML += "nXMLHttprequest error: " + err.description; // This prints "XMLHttprequest error: undefined" in the body.
        }
        xmlDoc = xmlhttp.responseXML;
        parser = new DOMParser(); // This code is untested as it does not run this far.
    }
</script>

我的XML文件在同一目录中。

<question>
    <query>what is 2+2?</query>
    <option>4</option>
    <option>5</option>
    <option>3</option>
    <answer>4</answer>
</question>

仅供参考，我通常用C#或Java编程，我在谷歌Chrome上运行我的网站。

Answer 1

所以这里可能有一些错误。

首先从阅读如何使用XMLHttpRequest.open()开始，因为有第三个可选参数用于指定是否发出异步请求，默认为true。这意味着您正在进行异步请求，并且需要在执行send()之前指定一个回调函数。下面是MDN的一个例子：

var oXHR = new XMLHttpRequest();
oXHR.open("GET", "http://www.mozilla.org/", true);
oXHR.onreadystatechange = function (oEvent) {
    if (oXHR.readyState === 4) {
        if (oXHR.status === 200) {
          console.log(oXHR.responseText)
        } else {
           console.log("Error", oXHR.statusText);
        }
    }
};
oXHR.send(null);

第二，由于您收到101错误，您可能使用了错误的URL。因此，请确保您请求的URL是正确的。此外，请确保您的服务器能够为您的quiz.xml文件提供服务。

您可能需要通过简化/缩小问题所在的范围来进行调试。因此，我会从发出一个简单的同步请求开始，这样您就不必担心回调函数了。下面是MDN发出同步请求的另一个例子：

var request = new XMLHttpRequest();
request.open('GET', 'file:///home/user/file.json', false); 
request.send(null);
if (request.status == 0)
    console.log(request.responseText);

此外，如果您刚开始使用Javascript，您可以参考MDN for Javascript API文档/示例/教程。

Answer 2

我看到两个可能的问题：

问题1

• XMLHTTPRequest对象在您尝试使用它时尚未完成数据加载

解决方案：为对象"onreadystatechange"-事件分配一个回调函数，并处理该函数中的数据

xmlhttp.onreadystatechange = callbackFunctionName;

一旦状态达到DONE（4），就可以读取响应内容。

问题2

• 并非所有浏览器中都存在XMLHTTPRequest对象（以该名称命名）

解决方案：要么使用try-catch为正确的浏览器创建正确的对象（IE中的ActiveXObject），要么使用框架，例如jQuery ajax方法

注意：如果您决定使用jQuery ajax方法，则使用jqXHR.done（）分配回调函数

Answer 3

问题可能出在以下行：

window.onload = onPageLoad();

通过包含括号，您表示onload应等于onPageLoad()的返回值。例如：

/*Example function*/
function onPageLoad()
{
    return "science";
}
/*Set on load*/
window.onload = onPageLoad()

如果您将window.onload的值打印到控制台，它将是：

科学

解决方案是移除支架：

window.onload = onPageLoad;

因此，您使用onPageLoad作为对该命名函数的引用。

最后，为了获得响应值，您需要XMLHttpRequest对象的readystatechange侦听器，因为它是异步的：

xmlDoc = xmlhttp.responseXML;
parser = new DOMParser(); // This code is untested as it doesn't run this far.

在这里添加侦听器：

xmlHttp.onreadystatechange = function() {
    if(this.readyState == 4) {
        // Do something
    }
}