如何使用 jQuery 檢測使用者何時滾動到 Div 底部？

使用jQuery 偵測捲動到Div 的底部

在自動溢出的div 中處理可變高度內容時，確定當使用者到達div底部時可能是一個挑戰。本文提供了使用 jQuery 檢測此事件的解決方案。

了解 Div 維度

要偵測使用者何時捲動到 div 底部，了解這一點至關重要與 div 尺寸關聯的屬性和方法。

• scrollTop()：傳回內容垂直向下捲動的像素數。
• insideHeight()：傳回 div 的內部高度，不包括捲軸和邊框。
• scrollHeight：傳回 div 內容的總高度，包括隱藏內容。

偵測底部捲動事件

以下jQuery 程式碼可以偵測使用者何時到達div 底部：

jQuery(function($) {
    $('#flux').on('scroll', function() {
        if($(this).scrollTop() + $(this).innerHeight() >= $(this)[0].scrollHeight) {
            alert('end reached');
        }
    })
});

代碼說明

• $(#flux)
：選擇ID為「flux」的div。
• on ('scroll')
：給div綁定滾動事件

• if($(this).scrollTop() $(this>

  if($(this).scrollTop() $(this ).innerHeight() >= $(this)[0].scrollHeight)
  :
  • 檢查目前捲動位置和內部高度總和是否大於或等於總內容高度。
  如果為 true，此條件表示使用者已捲動至或超出 div 的底部。
alert('endreach')

：顯示到達內容末端時發出警報訊息。

以上是如何使用 jQuery 檢測使用者何時滾動到 Div 底部？的詳細內容。更多資訊請關注PHP中文網其他相關文章！