基于用户垂直滚动向HTML表添加行

Add rows to HTML table based on User vertical scrolling

本文关键字：滚动 HTML 添加行 垂直 于用户 用户      更新时间：2023-09-26

我有一个jsp页面，其中包含1000多个对象的列表。由于我的要求，我必须在同一页上显示所有1000条记录，不带任何页码。我有一个javascript方法，可以在文档就绪函数上将行添加到表中。

我有两个问题：1.Javascript方法使用struts标记来获取标签和列表值，然后将行添加到HTML表中。这种方法需要花费大量时间，因为从服务器解析所有标签都需要大量时间。

  1. 我想在表中一次只添加50条记录，然后当用户垂直向下滚动时，我想以某种方式检测到用户已经到达末尾，这样我就可以在表中添加接下来的50行。由于我已经有了所有的记录，所以我不必去数据库获取下一行

附言：我所有的1000张唱片都来自一张桌子，我很快就能拿到。只有在对这些记录进行渲染时才会出现问题。

首先，在document.ready()调用上仅将50个整数加载到页面。

使用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
     }
   }
});
相关文章：