XMLHttpRequest (Ajax) 錯誤

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 編程，並且我在 Google 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以獲取 Javascript API 文檔/示例/教程。

Answer 2

我看到兩個可能的問題：

問題一

• XMLHTTPRequest 對象在您嘗試使用它時尚未完成加載數據

解決方案：為對象“onreadystatechange”-event分配一個回調函數並處理該函數中的數據

xmlhttp.onreadystatechange = callbackFunctionName;

一旦狀態達到 DONE (4)，響應內容就可以被讀取了。

問題二

• XMLHTTPRequest 對象並非在所有瀏覽器中都存在（以該名稱命名）

解決方案：使用 try-catch 為正確的瀏覽器創建正確的對象（IE 中的 ActiveXObject）或使用框架，例如jQuery ajax-method

注意：如果你決定使用 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
    }
}