Ajax調用在實際完成調用之前完成成功？

我試圖找出一個ajax調用...我需要調用阻止並完成加載HTML內容，然後再次執行（它由keyup事件觸發）...否則返回的HTML實際上會加載多次。在我的情況下，ajax調用返回HTML，然後執行JS函數。但是當它被多次加載時，JS函數會執行兩次=錯誤。Ajax調用在實際完成調用之前完成成功？

這裏是我的代碼（警告框僅用於幫助...）：

$(document).ready(function() { 

    var isProcessing = false; 

    $('#productSearchInput').keyup(function() { 

    var productSearchInput = $(this).val(); 
    var dataString = 'searchInput='+ productSearchInput; 
    var script_url = '../ajax/service-search.php'; 

    if(productSearchInput.length > 3 && isProcessing === false) { 
     $.ajax({ 
     type: 'GET', 
     url: script_url, 
     data: dataString, 
     beforeSend:  
      function() {  
      isProcessing = true; 
          alert('Processing input: ' + productSearchInput; 
      }, 
     success: 
      function(server_response) { 
      $('#searchresultdata').html(server_response).show('fast', function() { alert('Currently processing...'); }); 
      }, 
     error: 
      function() { 
      alert('ajax call failed...'); 
      }, 
     complete: 
      function() { 
      isProcessing = false; 
          alert('Processing done'); 
      } 
     }); 

    } 

    return false; 
    }); 
});

什麼是錯的是，「處理完成」警報之前出現的「等待處理」警報..然後在「處理完成」警報顯示後，顯示「等待處理」警報。

我需要我的HTML server_response顯示，完成呼叫並設置isProcessing =假前; ...

如何做到這一點？

來源

2012-10-09 EibergDK

這是正常行爲。使用show方法需要一些時間用於動畫，因此完成後調用回調。爲什麼不來簡化你的代碼是這樣的：

$.ajax({ 
    type: "GET", 
    url: script_url, 
    data: dataString, 
    beforeSend: function() {  
     isProcessing = true; 
     alert('Processing input: ' + productSearchInput); 
     }, 
    success: function(server_response) { 
     alert('Wait for processing...'); 
     $('#searchresultdata').html(server_response).show('fast', function() { 
      alert('Processing done'); 
      isProcessing = false; 
     });      
    }, 
    error: function() { 
     alert('ajax call failed...'); 
    } 
});

來源

2012-10-09 11:33:43 Inferpse

這就是我開始;）我之所以需要呼叫等待HTML加載，是somtimes我正在掃描條形碼。當我掃描一個條形碼時，HTML在它再次消失之前永遠不會被加載。然後，我可以點擊一個隨機鍵，因爲ajax調用是由鍵盤觸發的 - 然後讀取我掃描的數字。我曾嘗試用ENTER設置barcodescanner作爲終止符，但這一切發生得太快 - 因爲HTML尚未加載。 – EibergDK

也許你可以在jsfiddle上提供更詳細的信息或示例，以便用戶可以重現你的問題？也許'xhr.abort（）'或'setTimeout'可以幫助避免過多的Ajax調用/內容重新加載？ – Inferpse

如果我做一個簡單的例子，一切都很好...。我加載HTML的.php，當然包括mySQL查詢。我很確定我的ajax調用比我的PHP文件中的mySQL查詢更快完成，這會導致ajax調用在任何HTML返回之前重新開始... – EibergDK

你爲什麼不使用jQuery.Deferred對象，而不是isProcessing？

請在這種情況下，檢查代碼（像這樣）：

 var isProcessing = $.Deferred(); 

    $.ajax({ 
     type: "GET", 
     url: script_url, 
     data: dataString, 
     beforeSend: function() {  
      alert('Processing input: ' + productSearchInput); 
     }, 
     success: function(server_response) { 
      alert('Wait for processing...'); 
      $('#searchresultdata').html(server_response).show('fast', isProcessing.resolve);      
     }, 
     error: function() { 
      alert('ajax call failed...'); 
     } 
    }); 
    $.when(isProcessing).then(function(){alert('Processing done');});

來源

2012-10-09 12:14:11 n1ckolas

未更改任何內容...我已更新我的腳本包括更多的陳述... – EibergDK

Ajax調用在實際完成調用之前完成成功？

回答

相關問題