基於用戶垂直滾動將行添加到HTML表格

我有一個jsp頁面，其中包含超過1000個對象的列表。由於我的要求，我必須在沒有任何分頁的情況下在同一頁面上顯示所有1000條記錄。我有一個JavaScript的方法，將行添加到文檔就緒函數的表中。基於用戶垂直滾動將行添加到HTML表格

我有2個問題：1）Javascript方法有struts標籤來獲取標籤和列表值，然後它將行添加到HTML表格中。由於所有標籤都花費大量時間從服務器解析，因此此方法花費了大量時間。

我想在表格中一次只添加50條記錄，然後當用戶垂直向下滾動時，我想以某種方式檢測到用戶已到達最後，以便我可以在表中添加下50行。因爲我已經有了所有的記錄，所以我不必去數據庫取下一行。

PS：我所有的1000條記錄都來自單個表格，我可以在任何時候讀取它們。只有在爲這些記錄進行渲染時纔會出現問題。

2016-04-29 Ishan Rastogi

首先，在document.ready()調用頁面上只加載50個entiries。

使用jQuery的.scroll()方法觸發事件，以便在用戶擊中表的末尾時追加50個更多的條目。

$('#table').scroll(function() { 
    if($('#table').scrollTop() + $('#table').height() == $('table').height()) { 
    for(var i = 0; i <= 50; i++) { 
     //Append next value in your array to bottom 
    } 
    } 
});

來源

2016-04-29 08:58:00

謝謝，這是解決我的第二個問題。但我仍然不確定第一個。即使我沒有調用這個javascript方法，它仍然需要很長時間來渲染頁面，但是如果我刪除了該方法的代碼，那麼頁面渲染速度非常快。 –

你可以發佈你正在使用的當前代碼嗎？ HTML JS –

基於用戶垂直滾動將行添加到HTML表格

回答

相關問題