Javascript和Ajax加載頁面滾動更多：不加載更多智能手機上運行android或ios

Question

我有這個JavaScript和Ajax代碼，從頁面滾動到底部加載更多數據從數據庫。它在桌面和筆記本電腦上運行得非常好。但是，從智能手機加載時似乎存在問題。它會加載前10個項目，並且不會像桌面一樣在頁面滾動上加載更多內容。它不會拋出任何錯誤或警報。無論我做什麼或者如何定位屏幕，它都不會加載更多內容。

var page_num = 1; 
var loading = false; 
load_more_contents(page_num); 
$(window).scroll(function() { 
if($(window).scrollTop() + $(window).height() >= $(document).height()) { 
    page_num++; 
    load_more_contents(page_num); 
} 
});  
function load_more_contents(page_num){ 
if(loading == false){ 
    loading = true; 
    $('.loading-info').show(); 
    $.post('load_more_videos.php', {'page': track_page}, function(data){ 
     loading = false; 
     if(data.trim().length == 0) 
     { 
      $('.loading-info').html('<p> End of records</p>'); 
      return; 
} 
$('.loading-info').hide(); 

$("#results").append(data); 
}).fail(function(xhr, ajaxOptions, thrownError) { 
     alert(thrownError); 
    }) 
} 
} 

Answer 1

我終於找到了解決方案。對未來可能有幫助的人。基本上你只需要抵消頁面的底部就可以說。當用戶在屏幕上滾動，你要下很多無法加載頁面的底部，但略高於它（注意-100）

$(window).scroll(function() { 
if($(window).scrollTop() + $(window).height() >= $(document).height()-100) { 
page_num++; 
load_more_contents(page_num); 
} 
}); 

這裏有一個演示：http://jsbin.com/humiwek/edit?js,console,output