在網頁開發中,經常會遇到需要實現一個div在滾動到底部時,自動向下加載更多內容的需求。jQuery是一個非常流行的JS庫,它提供了豐富的DOM操作和事件處理函數,可以很方便地實現這個功能。
實現方法如下:
$(function () { $('#myDiv').scroll(function () { var scrollHeight = $(this)[0].scrollHeight; //滾動高度 var scrollTop = $(this).scrollTop(); //滾動條頂部距離 var windowHeight = $(this).height(); //可見高度 if (scrollTop + windowHeight == scrollHeight) { //滾動到底部 // TODO: 加載更多內容 } }); });
首先,我們通過scroll函數監聽div的滾動事件。然后,獲取滾動高度、滾動條頂部距離和可見高度三個值。最后,通過判斷滾動條頂部距離和可見高度之和是否等于滾動高度,來判斷是否滾動到了底部。
在判定到達底部時,就可以編寫代碼來加載更多內容了。
這就是一個簡單的jquery實現div滾動到底部自動加載更多的代碼。