在元素滚动到视图时加载内容

Question

我有一个<div>具有静态高度和overflow: auto;样式的元素中的搜索结果列表。我只想加载搜索结果的前x个（例如20个），并在用户滚动到包含搜索结果的元素的底部时加载另一个x个结果。

谁能向我解释我将如何做？我找到了一些示例，但所有示例都使用了整个文档的滚动值，而不是单个<div>。我正在使用jQuery，如果有关系的话。

Answer 1

对我来说，听起来像是您想在滚动条即将结束时检测滚动条的位置。
在jquery组上四处搜寻时发现了这一点。提出的解决方案，如有需要，可添加一些文档：

$.fn.isNearTheEnd = function() {
  // remember inside of $.fn.whatever = function() {}
  //   this is the jQuery object the function is called on.
  //   this[0] is DOMElement
    return this[0].scrollTop + this.height() >= this[0].scrollHeight;
};

// an example.
$("#content").bind("scroll", function() {
  if ($(this).isNearTheEnd()) // load some content
});