如何在數據表中一點點地加載ajax數據表

Question

查看數據表我無法實現此目標。現在我可以用不同的方式加載它們，使用ajax（通過使用服務器端）不同的行和不同的順序，但現在我不能加載行例如4或5次，使多個請求ajax（我想使用滾動加載一點一點）。

我該怎麼做？

Answer 1

如何修改您的ajax加載x行數，從第一個開始，然後當最後一個條目的頂部偏移量進入視圖時，您可以在同一個文件上觸發另一個ajax事件，但使用x來知道最後一行是加載的，所以它會知道哪一行開始加載？

所以說，它最初加載0-5行，當5進入視圖時，它觸發一個事件，它將通過相同的ajax但值爲5，所以它會從6開始，並加載下6行，等等你可以使用相同的函數進行初始和後續加載，它只會被附加到主元素的html中。

編輯 好了，所以我們需要一個PHP文件，拉動和格式化數據，和包含Ajax和顯示所有的HTML文件。

爲PHP，是這樣的：

$offset = 0; 
$sql = "SELECT * FROM table ORDER BY id LIMIT 20, ".$offset; 

然後運行一個循環來格式化您希望他們成爲行。

這將最初填充20頁的偏移量，默認爲0。

然後對於Ajax，有兩部分。首先是對最後一項映入眼簾創建一個動作：

var go = true; 
function hitbottom() { 
    var sh = $(window).scrollTop(); 
    var wh = $(window).height(); 
    var ih = $('.item').last().offset().top; 
    if ((sh+wh)<ih && go) { 
     //run ajax 
    } 
} 

這應該上滾動運行時的最後一個項目的頂部碰到屏幕下方觸發。

第二個是創建ajax表單，它需要知道顯示的最後一行的id。它將使用該值來更改PHP文件中偏移量變量的值，然後該文件將獲得接下來的20行並將它們發送回jquery以附加到回調中的html，依此類推...

ajax部分應設置爲false，然後在回調中將其設置爲true以重新開始。

要追加的數據，你可以使用這樣的事情：

$('#element').append(data); 

這是未經測試，只是一個想法。我可以想象它與你的Facebook feed如何加載相似。一旦你點擊底部，它彈出加載圖標，並加載下一組職位。只有這樣，它纔會在你觸及底部之前開始加載，所以除非你馬上噴射，否則它應該能夠很快地獲得新的數據。

這也允許您逐漸增加html文件內容，而不會一次加載大量內容並放慢速度。可能仍然有限制，但它應該相當大。