js如何實現上拉載入更多

我們在專案中經常使用到下拉載入更多，之前要麼是底部寫載入按鈕，要麼是引入外掛程式。今天終於有時間手寫乙個了，之前感覺挺麻煩，明白原理後，其實很簡單...

scrolltop：滾動視窗的高度距離window頂部的距離，它會隨著往上滾動而不斷增加，初始值是0，它是乙個變化的值；

clientheight:它是乙個定值，表示螢幕可是區域的高度；

scrollheight：頁面不能滾動時是不存在的，body長度超過window時才會出現，所表示body所有元素的長度，

由上面的三個值所產生乙個原理公式：

scrolltop + clientheight >= scrollheight

let clientheight  = document.documentelement.clientheight; //瀏覽器高度

let scrollheight = document.body.scrollheight;
let scrolltop = document.documentelement.scrolltop;
let distance = 50;  //距離視窗還用50的時候，開始觸發；
if ((scrolltop + clientheight) >= (scrollheight - distance)) 

js如何實現上拉載入更多

我們在專案中經常使用到下拉載入更多，之前要麼是底部寫載入按鈕，要麼是引入外掛程式。今天終於有時間手寫乙個了，之前感覺挺麻煩，明白原理後，其實很簡單.scrolltop 滾動視窗的高度距離window頂部的距離，它會隨著往上滾動而不斷增加，初始值是0，它是乙個變化的值 clientheight 它是乙...

js上拉載入更多

方法一 jq var page 1,分頁碼 off on false,分頁開關 滾動載入方法 1 中用的 timers null 定時器 滾動載入方法 2 中用的 載入資料 var loadingdatafn function off on true 重要 這是使用了 時 用到的 如果用 滾動載入方...

js上拉載入更多

jq方法 方法一 var page 1,分頁碼 off on false,分頁開關 滾動載入方法 1 中用的 timers null 定時器 滾動載入方法 2 中用的 載入資料 var loadingdatafn function off on true 重要 這是使用了 時 用到的 如果用 滾動載...