只有在上次重新加載完成時才使用jquery重新加載頁面

Question

我有一個頁面，當前每10秒刷新一次。該頁面運行一系列數據庫查詢並顯示結果。

問題是，有時查詢需要一分鐘才能運行，但頁面仍會每10秒刷新一次，因此最終會運行6組數據庫查詢，依此類推。我知道這一點，因爲我在數據庫中以查詢的開始和結束時間記錄了操作。

$(document).ready(function() { 
var refreshId = setInterval(function() { 
     $("#content").load('myurl.php?id=1');       
    }, 10000);       
}); 

我怎樣才能改變它，刷新僅發生在頁面完成處理查詢或10秒取最長？

Answer 1

爲什麼不只是設置一個標誌，如果最後一個尚未完成，跳過重新加載？像下面的內容（未經測試，但顯示了基本的想法）

var loading = false; 

var refreshId = setInterval(function() { 
     if (loading) 
      return; 

     loading = true; 
     $("#content").load('myurl.php?id=1', function() { 
      loading = false; 
     });       
    }, 10000);       
}); 

Answer 2

你可以使用像AjaxQueue這樣的插件排列你的ajax請求。

Answer 3

您可以使用setTimeout代替，完成之後重新加載定時器

Answer 4

而是定期刷新頁面，通過Ajax調用，當獲取數據它完全重新計劃刷新。

在僞代碼：

// Set initial timeout, 10 seconds 
var refTimeout = setTimeout(refreshData, 10000); 

function refreshData() 
{ 
    // Remove timeout, we won't be called again until AJAX call is complete 
    clearTimeout (refTimeout); 

    $.ajax ({url: 'mydatasource.php', data : { ... }, 
     success : function (data) { 
     // Render data into content area... 

     // Set timeout so we'll be called again in 10 seconds 
     refTimeout = setTimeout (refreshData, 10000);   
     } 
    }); 

}