如何將responseText從異步AJAX調用傳遞給另一個函數？

Question

我正在使用jQuery和countdown（jQuery插件）。我希望倒計時運行x秒，其中x是serverTime.php中的整數。

問題 - 我無法弄清楚如何在函數getTime（）中返回responseText，以便它可以在Timer函數中使用。

起初，我嘗試使用純JS（無jQuery的），我也發現了類似的主題：

• why-can-i-not-return-responsetext-from-an-ajax-function
• in-ajax-how-to-retrive-variable-from-inside-of-onreadystatechange-function
• how-to-return-variable-from-the-function-called-by-onreadystatechange-function
• 和其他...

我遇到過的一些想法/可能的解決方案：

• 使用同步調用和全局變量來存儲響應。我 試過這個，並不認爲它是一個選項，因爲它凍結了 用戶屏幕（在大多數情況下也被認爲是不好的做法）
• helper function。
-

定時器功能：

$(function(){ 
    var time = getTime(); // time is an integer 
    $('#defaultCountdown').countdown({until: time, format: 'S', onExpiry: action}); 
}); 

的getTime（）檢查serverTime.php和應返回的內容，這將是一個整數。 Alert（html）有效，而return html不起作用。我知道這是因爲這個調用是異步的。

function getTime() 
{ 
    $.ajax({ 
    url: "serverTime.php", 
    cache: false, 
    async: true, 
    success: function(html) 
    { 
     alert(html); 
      helperFunction(html); 
     return html; 
    } 
    }); 
} 

helperFunction。不幸的是，我不知道如何將結果傳遞給定時器功能。

function helperFunction(response) 
{ 
    return response; 
} 

serverTime.php

echo 30; // 30 seconds, just an example 

我試着解釋我的問題，並表明我已經把一些時間到了。如果您需要更多信息，請詢問。也許我只是在錯誤的方向思考。

Answer 1

您的代碼不顯示實際使用time變量的位置。

最終，你不能返回從getTime()功能的AJAX響應，因爲AJAX是異步，所以在接收之前的響應getTime()總是返回。

你會怎麼做才能通過你想進入getTime()功能的任何代碼...

function getTime(func) 
{ 
    $.ajax({ 
     url: "serverTime.php", 
     cache: false, 
     async: true, 
     success: func // <--set the function received as the callback 
    }); 
} 

    // pass a function to getTime, to be used as the callback 

function myFunc(html) { 
    /* do something with html */ 
} 
getTime(myFunc); 

...或者從:success回調內部調用另一個函數，傳遞給它的響應...

function getTime(func) 
{ 
    $.ajax({ 
     url: "serverTime.php", 
     cache: false, 
     async: true, 
     success: function(html) { 
      someFunction(html); // <--- call a function, passing the response 
     } 
    }); 
} 

someFunction(html) { 
    /* do something with html */ 
} 

...或者乾脆硬編碼正確的代碼到:success回調...

function getTime(func) 
{ 
    $.ajax({ 
     url: "serverTime.php", 
     cache: false, 
     async: true, 
     success: function(html) { 
      /* do something with html */ 
     } 
    }); 
} 

---

編輯：

我現在看到你想使用time。你可以使用我的第二個例子。請確保您創建的功能位於您的getTime()函數可訪問的變量範圍內。

像這樣：

$(function(){ 
    getTime(); // get things started when the DOM is ready 
}); 

function getTime() { 
    $.ajax({ 
     url: "serverTime.php", 
     cache: false, 
     async: true, 
     success: function(html) 
     { 
      doCountdown(html); // call doCountdown, passing it the response 
     } 
    }); 
} 

    // doCountdown receives the response, and uses it for the .countdown() 
function doCountdown(time) { 
    $('#defaultCountdown').countdown({until: time, format: 'S', onExpiry: action}); 
} 

Answer 2

因爲要異步運行您的AJAX，它運行在一個單獨的線程。這意味着你設置的地方var time = getTime();什麼都沒有設置。到return html;的ajax調用運行時，沒有任何等待接收響應。原始線程已完成運行，並且由於功能getTime()未設置任何內容，因此time將爲空白。

你可以，設置時間爲全局變量，然後調用getTime()，並設置時間當Ajax調用完成 - 這一切都取決於在那裏，當你需要使用的時間....

var time = 0; 

$(function(){ 
    getTime() 
    $('#defaultCountdown').countdown({until: austDay, format: 'S', onExpiry: action}); 
}); 

function getTime() 
{ 
    $.ajax({ 
     url: "serverTime.php", 
     cache: false, 
     async: true, 
     success: function(html) 
     { 
      time = html; 
     } 
    }); 
}