javascript - 当元素滚动到 View 中时加载内容

Question

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

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

Answer 1

我觉得您想在滚动条接近尾端时检测它的位置。 Found this在 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
});