模擬場景:移動端上劃到底,載入更多資料。
1、本例子基於jquery實現。監聽滾動事件。
2、獲取滾動條到文件頂部的距離,上圖scrolltop那段。原生js可用document.documentelement.scrolltop獲取。
var scrolltop = math.ceil($(this).scrolltop());
3、獲取可視區高度。原生js可用document.documentelement.clientheight獲取。
var _height = $(this).height()
4、獲取文件總高度。原生js用document.body.scrollheight獲取
var _h = \((document).height();
5、如果scrolltop+_height的距離大於等於_h,說明觸底了,再次請求資料追加到當前資料後面即可。
完整**如下:getimage()為請求資料的方法。
\)(function()
})
移動端滾動載入 jQuery 和 原生JS
判斷滾動條到底部,需要用到dom的三個屬性值,使用jquery分別是 body scrolltop 為滾動條在y軸上的滾動距離。window height 為內容可視區域的高度。body height 為內容可視區域的高度加上溢位 滾動 的距離。從這個三個屬性的介紹就可以看出來,滾動條到底部的條件即...
移動端滾動載入 jQuery 和 原生JS
判斷滾動條到底部,需要用到dom的三個屬性值,使用jquery分別是 body scrolltop 為滾動條在y軸上的滾動距離。window height 為內容可視區域的高度。body height 為內容可視區域的高度加上溢位 滾動 的距離。從這個三個屬性的介紹就可以看出來,滾動條到底部的條件即...
M端滾動非同步載入資料
var currentpage 1 預設頁 var pages 總頁數 function nextpage currentpage if currentpage pages if currentpage 1 var response ajax success function data async ...