Javascript AJAX函數調用延遲

Question

我似乎無法弄清楚如何使此功能正常工作。 至關重要的是， tStat = xmlhttp2.responseText似乎已延遲。 我用.innerHTML + =“ intratest” + Stat測試了它。 它打印出“ intesttest intest 0”。 因此，它會進行幾次迭代直到它具有值？ 0是我想要的Stat的值，而checktStatus.php從數據庫中獲取它。

但是由於此函數返回一個值，並且我已將其從另一個函數調用為該值的變量，因此不能在返回之前延遲DB讀取它。 但是我不知道該怎么做！ 救命？

編輯：拿出一些注釋的代碼，但問題仍然存在。 它返回一個“未定義”的值，然后才能獲得真實的值。

function gettStatus()
{
    var tStat;

    if (window.XMLHttpRequest)
    {     // code for IE7+, Firefox, Chrome, Opera, Safari
            xmlhttp2=new XMLHttpRequest();
    }
    else
    {     // code for IE6, IE5
            xmlhttp2=new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp2.onreadystatechange=function()
    {
      if (xmlhttp2.readyState==4 && xmlhttp2.status==200)
        {
            tStat=xmlhttp2.responseText;        

            document.getElementById("txtHint").innerHTML+=" withintest "+tStat;
            return tStat;
        }
    }
    xmlhttp2.open("GET","checktStatus.php?tID=1",true);

    xmlhttp2.send();    
}

Answer 1

onreadystatechange如何工作

當更改readyState時，將onreadystatechange事件處理程序-就像事件的名稱所暗示的那樣。 因此，您必須檢查狀態和狀態（就像您在評論的部分中所做的一樣）。

在此處查看更多詳細信息： Mozilla開發人員網絡：AJAX-入門

readyState值列表

從上面引用的頁面（ 鏈接到部分 ）：

readyState值的完整列表如下：

• 0（未初始化）
• 1（正在加載）
• 2（已加載）
• 3（互動）
• 4（完整）

AJAX的異步性質

您還應該意識到以下事實，通常AJAX通常是異步工作的，因此，您只需傳遞將在收到響應后執行的回調，這將更加容易，例如：

function gettStatus(callback){
    // do something here...
    callback(result); // ...and execute callback passing the result
}

解

因此，您應該編輯代碼以使其看起來與此類似（不帶readyState / status條件）：

function gettStatus(callback)
{
    var tStat;

    if (window.XMLHttpRequest)
    {     // code for IE7+, Firefox, Chrome, Opera, Safari
            xmlhttp2=new XMLHttpRequest();
    }
    else
    {     // code for IE6, IE5
            xmlhttp2=new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp2.onreadystatechange=function()
    {
        if (xmlhttp2.readyState==4 && xmlhttp2.status==200)
        {
            tStat=xmlhttp2.responseText;        

            document.getElementById("txtHint").innerHTML+=" withintest "+tStat;
            callback(tStat);
        }
    }
    xmlhttp2.open("GET","checktStatus.php?tID=1",true);

    xmlhttp2.send();    
}

然后像這樣使用它：

gettStatus(function(tStat){
    // tStat here is accessible, use it for further actions
});

而不是以以下方式使用它：

var tStat = gettStatus();
// tStat would be available here, if gettStatus() would not involve
// asynchronous requests

Answer 2

您注釋掉的行用於過濾就緒狀態 。

/*if (xmlhttp2.readyState==4 && xmlhttp2.status==200)
{*/
    tStat=xmlhttp2.responseText;        
    document.getElementById("txtHint").innerHTML+=" withintest "+tStat;
    return tStat;
//}

應該

if (xmlhttp2.readyState==4 && xmlhttp2.status==200)
{
    tStat=xmlhttp2.responseText;        
    document.getElementById("txtHint").innerHTML+=" withintest "+tStat;
    return tStat;
}