スクロール位置に基づいてテーブルにコンテンツをロードする

Question

私はjQueryを使用していますが、特定の高さでテーブルを設定しています（overflow:scroll）。私はサーバーからより多くのデータを読み込むタイミングを知るために何をアクセスすべきか疑問に思っています（私はajax呼び出しや実際のデータのロードには助けが必要ありません）。むしろ、私はスクロール位置を知る方法を理解したり、いつデータの底に到達しているかを知ることを試みています（もっと早くロードすることができます）。

スクロール位置に基づいてさらにデータを読み込むタイミングを知る方法を教えてください。あなたがもしそうなら、あなたには、いくつかを使用する必要があり、ユーザーは底に到達する前に、より多くのデータをロードする場合があります

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

：ここ

Answer 1

は、非標準（しかし、広くサポートされている）scrollHeightプロパティを使用して、ソリューションです。しきい値：

$("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を使用したくない場合は、あなたが計算に使用できる高された内部要素を持っている必要があります。おそらく、tableをdivにラップし、代わりにdivにoverflow: scrollと設定します。詳細はhow to tell if you're scroll to bottomを参照してください。