停止滾動綁定功能，直到AJAX請求succeded

Question

我做jQuery的無限滾動的腳本，看起來像這樣：

$(window).scroll(function(){ 
    if($(window).scrollTop() >= $(document).height() - $(window).height() - 50){ 

    // If we have not loaded all pages yet 
    if($('#feed').data('pagesloaded') != 0){ 
     var toload = $('#feed').data('pagesloaded') + 1; 

     $.post("/feed/" + toload, { 'ignore': showed_posts_id }, function(html){ 
     if(html){ 
      $('#feed') 
      .data('pagesloaded', toload) 
      .append(html); 
     }else{ 
      // If all pages are loaded, disable infinite scrolling 
      $('#feed').data('pagesloaded', 0); 
     } 
     }); 

    } 
    } 
}); 

其中50是像素從該事件是底部偏移觸發。但是，當滾動到頁面底部時，該函數會在偏移量從50到0時被觸發很多次，這會導致所有頁面一次加載。我聽說過將綁定事件綁定到$（window）.ajaxStart（）和.ajaxStop（）的技術，但是由於很多異步ajax正在我的應用程序中進行，它會干擾無限滾動。這就是我說的：

var ajaxRunning = false; 
$(window).ajaxStart(function() { 
    ajaxRunning = true; 
}).ajaxStop(function() { 
    ajaxRunning = false; 
}); 

我想過把一個簡單的二進制信號來檢查，如果一個$。員額仍在進行中，但我不知道，如果是不好的做法。什麼是最好的方法來做到這一點？

Answer 1

我終於通過在$（窗口）上放置一個簡單的數據標誌來完成它。如果有人認爲它不好，並且知道更有效的方法，我會很高興聽到它！

$(window).scroll(function(){ 
    if($('#feed').data('pagesloaded') != 0 && !$(window).data('infinite-scroll-async')){ 
    if($(window).scrollTop() >= $(document).height() - $(window).height() - 50){ 

     // Locks the function 
     $(window).data('infinite-scroll-async', true); 

     var toload = $('#feed').data('pagesloaded') + 1; 

     $.post("/feed/" + toload, { 'ignore': showed_posts_id }, function(html){ 

     if(html){ 
      $('#feed') 
      .data('pagesloaded', toload) 
      .append(html); 
     }else{ 
      // If all pages are loaded, disable infinite scrolling 
      $('#feed').data('pagesloaded', 0); 
     } 

     }).complete(function(){ 

     // Unlocks the function 
     $(window).data('infinite-scroll-async', false); 

     }); 

    } 
    } 
});