jquery ajax調用循環一個又一個沒有停止頁面呈現

Question

我有一個超過100行的表。

每一行由pdf文件及其與STATUS的最後一行的描述組成。

狀態顯示pdf文件是否可讀不是。

一旦表格被加載到瀏覽器中，我就會從表格的每一行生成每個文件名並使用ajax調用來處理它。如果文件可讀，我將該行的狀態字段更新爲READABLE。 處理每個pdf文件需要30秒到1分鐘（取決於文件的大小）

我不想使用異步調用，併發送所有100的請求到我的服務器togather。

當我使用async = false。它會逐個執行每個ajax調用，這就是我想要做的， ，但同時它會停止用戶瀏覽已加載的表。換句話說，用戶有點卡住，直到所有這些Ajax請求完成。那麼他可以向下滾動閱讀更多信息。

我想讓用戶在後臺讀取網頁，我希望一個接一個地執行ajax請求來處理pdf文件並更新其每一行的狀態。

我該怎麼做。

$('table.tableRecods tr').each(function(){ 

      fileWithPath = $('#filePath').text(); 
      $this = $(this); 
      $this.find('td.status img.cropStatus').attr('src', 'img/loader.gif') ;   
       $.ajax({ 
        url:'jsonCall.php', 
        async:false, 
        data: {file: escape(fileWithPath)}, 
        success: function(data){   

          if(data.status == 'true') { 
           $this.find('td.status img.readStatus').attr('src', 'img/icons/read.png') ;         
          }else if(data.status == 'false'){ 
           $this.find('td.status img.readStatus').attr('src', 'img/icons/__read.png') ; 

          } 
        } 
       }); 

    }); 

Answer 1

使用異步ajax。例如，您可以爲要處理的所有錶行創建一個數組，並從數組中取出第一個並開始查詢。將代碼放到偵聽器中，當最後一個查詢完成時開始下一個查詢。

var toRequest=new Array("test1", "test2", "test3"); 
function doRequest(index) { 
    $.ajax({ 
    url:'jsonCall.php?data='+toRequest[index], 
    async:true, 
    success: function(data){   
     //do whatever you want do do 

     if (index+1<toRequest.length) { 
     doRequest(index+1); 
     } 
    } 
    }); 
} 
doRequest(0);