javascript - 要素がスクロールして表示されるときにコンテンツを読み込む

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
});

Answer 2

.top() + .height()divをウィンドウと比較すると、そのdivの.scrollTop + .height最下部にいることがわかり、次のコンテンツの読み込みをトリガーできます...