1. 程式人生 > >同一頁面無法多次使用XmlHttp發起Ajax請求的真實原因

同一頁面無法多次使用XmlHttp發起Ajax請求的真實原因

當該頁面第一次發出Ajax請求的時候可以正常執行,但是從第二次呼叫開始發現——onreadystatechange()事件再也沒有被呼叫!
於是上Google查了一下,發現還有不少人為此感到困擾,而且發現很多人持有的是這個錯誤的觀點:
他們說這是因為一個XmlHttp只能使用一次send(),每次要使用新的XmlHttp。但是我的XmlHttp是函式內的區域性變數,函式執行完畢它就會被銷燬啊,而且即使我在函式的開頭把它賦值null也沒有用。
/*然後我發現一個十分有意義的帖子
*/
原來是這個原因,由於IE瀏覽器有快取,第一次傳送的Ajax請求確實被髮送出去了,也接收到了迴應,所以就觸發了onreadystatechange()事件。但是從第二次起IE瀏覽器發現快取裡面已經有請求的頁面,於是Ajax請求將不再被髮送出去,這樣當然也不會觸發onreadystatechange()事件了。所以只要我們在Url里加上+"&"+Math.random()就可以避免這個問題
。當我做了這樣修改後果真就可以在同一頁面多次使用XmlHttp發起Ajax請求了。接著我把xmlhttp = null刪除掉也仍然可以正常運行了。
附程式碼如下:
<script type="text/javascript">
function createXHR() {
    if (window.XMLHttpRequest) {
        return new XMLHttpRequest();
    }
    if (window.ActiveXObject) {
        var msxmls = ['MSXML3', 'MSXML2', 'Microsoft']
        for (var i=0; i < msxmls.length; i++) {
            try {
                return new ActiveXObject(msxmls[i]+'.XMLHTTP')
            } catch (e) { }
        }
        throw new Error("No XML component installed!")
    }
}
</script>
<script type="text/javascript">
function refreshComment() {
    var xmlhttp = createXHR();
    var xmlhttpUrl = "flash.aspx?ajax=refresh&"+Math.random();
    xmlhttp.open("GET", xmlhttpUrl, true);
    xmlhttp.send(null);
    xmlhttp.onreadystatechange = function () {
        if (xmlhttp.readyState == 4) {
            if (xmlhttp.status == 200) {
//                alert("xmlhttp.status = " + xmlhttp.status);
//                alert("xmlhttp.readyState = " + xmlhttp.readyState);
               divCommentList.innerHTML=xmlhttp.responseText;
            }
        }
    }
}
</script>