基于滚动位置在表中加载内容

我正在使用jQuery，我已经设置了一个具有特定高度的表，其中包含overflow:scroll 。 我想知道我应该访问什么，以便知道何时从服务器加载更多数据（我不需要帮助ajax调用或加载实际数据）。 相反，我试图了解如何知道我的滚动位置或知道何时接近数据的底部（因此我可以提前加载更多）。

那么，我怎么知道何时根据滚动位置加载更多数据？

Answer 1

这是一个解决方案，使用非标准（但广泛支持）的scrollHeight属性：

 $("table").on("scroll", function(event) { var $elem = $(event.target); if(event.target.scrollHeight - $elem.scrollTop() === $elem.outerHeight()) { // Scrolled to bottom, load more data } }); 

您可能希望在用户到达底部之前加载更多数据，如果是这样，您应该使用一些阈值：

 $("table").on("scroll", function(event) { var $elem = $(event.target) , threshold = 100; if(event.target.scrollHeight - $elem.scrollTop() + threshold >= $elem.outerHeight()) { // Scrolled to bottom, load more data } }); 

如果您不想使用scrollHeight ，则必须具有可用于计算的高度的内部元素。 也许用div包装table ，然后设置overflow: scroll在div上overflow: scroll 。 了解详细信息， 了解如何滚动到底部 。