jQueryを使用して、ユーザーが可変コンテンツを含むDivの最後に到達したことを検出するにはどうすればよいですか?

jQuery を使用した Div スクロールの終わりの検出

目的:
ユーザーがいつ一番下までスクロールしたかを判断する指定された div 要素の。

質問:
可変量のコンテンツと自動に設定されたオーバーフローでユーザーが div の最後に到達したことをどのように検出できますか?

答え:

div スクロールの終わりを検出するには、次の jQuery プロパティ/メソッドを使用します:

• $()。 scrollTop(): 要素が水平または垂直にスクロールされた量を返します。
• $().innerHeight(): 要素の内側の高さを返します。
• DOMElement.scrollHeight: 要素のコンテンツの高さを返します。

最初の 2 つのプロパティを組み合わせて表示される合計の高さを取得し、それをscrollHeightと比較して決定します。ユーザーが一番下までスクロールしたとき。

<code class="javascript">jQuery(function($) {
    $('#flux').on('scroll', function() {
        if($(this).scrollTop() + $(this).innerHeight() >= $(this)[0].scrollHeight) {
            alert('End of div reached');
        }
    })
});</code>

追加メモ:

• 提供されるコードは jQuery 1.7 構文を使用します。古いバージョンの場合は、.on() の代わりに .bind() を使用してください。
• このソリューションは、div 内のコンテンツが動的に追加または削除された場合でも適切に機能します。
• イベント ハンドラーを調整します。好みのコンテナーとアクションに追加します。

以上がjQueryを使用して、ユーザーが可変コンテンツを含むDivの最後に到達したことを検出するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。