js實(shí)現(xiàn)滑動(dòng)到頁(yè)面底部自動(dòng)加載更多功能

更新時(shí)間：2017年02月15日 15:58:04 作者：denops

本文主要分享了js實(shí)現(xiàn)滑動(dòng)到頁(yè)面底部自動(dòng)加載更多功能的代碼。具有很好的參考價(jià)值，下面跟著小編一起來(lái)看下吧

話(huà)不多說(shuō)，請(qǐng)看代碼：

//滾動(dòng)條到頁(yè)面底部加載更多案例 
$(window).scroll(function(){
 var scrollTop = $(this).scrollTop();    //滾動(dòng)條距離頂部的高度
 var scrollHeight = $(document).height();   //當(dāng)前頁(yè)面的總高度
 var clientHeight = $(this).height();    //當(dāng)前可視的頁(yè)面高度
 // console.log("top:"+scrollTop+",doc:"+scrollHeight+",client:"+clientHeight);
 if(scrollTop + clientHeight >= scrollHeight){   //距離頂部+當(dāng)前高度 >=文檔總高度 即代表滑動(dòng)到底部 count++;         //每次滑動(dòng)count加1
 filterData(serviceTypeId,industryId,cityId,count); //調(diào)用篩選方法，count為當(dāng)前分頁(yè)數(shù)
 }else if(scrollTop<=0){ 
 //滾動(dòng)條距離頂部的高度小于等于0 TODO
 //alert("下拉刷新，要在這調(diào)用啥方法？");
 }
});

以上就是本文的全部?jī)?nèi)容，希望本文的內(nèi)容對(duì)大家的學(xué)習(xí)或者工作能帶來(lái)一定的幫助，同時(shí)也希望多多支持腳本之家！

您可能感興趣的文章:

相關(guān)文章

JavaScript表單焦點(diǎn)自動(dòng)切換代碼
這篇文章主要介紹了JavaScript表單焦點(diǎn)自動(dòng)切換代碼的相關(guān)資料,非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友可以參考下
2016-07-07
javascript十六進(jìn)制及二進(jìn)制轉(zhuǎn)化的方法
這篇文章主要介紹了javascript十六進(jìn)制及二進(jìn)制轉(zhuǎn)化的方法,涉及javascript中toString方法的使用技巧,需要的朋友可以參考下
2015-05-05
JavaScript繼承方式實(shí)例
JavaScript繼承方式實(shí)例，需要的朋友可以參考下。
2010-10-10
JS獲取時(shí)間的相關(guān)函數(shù)及時(shí)間戳與時(shí)間日期之間的轉(zhuǎn)換
時(shí)間戳和時(shí)間日期的轉(zhuǎn)換是常見(jiàn)的操作，下面就通過(guò)代碼實(shí)例介紹一下如何實(shí)現(xiàn)它們之間的相互轉(zhuǎn)換，感興趣的朋友一起學(xué)習(xí)吧
2016-02-02
JS如何循環(huán)遍歷JSON數(shù)據(jù)
這篇文章主要介紹了JS如何循環(huán)遍歷JSON數(shù)據(jù)的方法,本文提供了 JS 循環(huán) JSON 數(shù)據(jù)列,以及 JS 循環(huán)遍歷 JSON 數(shù)據(jù)的例子,需要的朋友可以參考下
2024-01-01
JS實(shí)現(xiàn)的DOM插入節(jié)點(diǎn)操作示例
這篇文章主要介紹了JS實(shí)現(xiàn)的DOM插入節(jié)點(diǎn)操作,結(jié)合實(shí)例形式分析了javascript針對(duì)頁(yè)面dom元素動(dòng)態(tài)操作相關(guān)實(shí)現(xiàn)技巧,需要的朋友可以參考下
2018-04-04
Javascript類(lèi)庫(kù)的頂層對(duì)象名用戶(hù)體驗(yàn)分析
針對(duì)jQuery、Ext、KISSY三者類(lèi)庫(kù)的對(duì)比及分析已經(jīng)很多了，但多數(shù)是從功能和設(shè)計(jì)的角度切入，因此本篇文章決定換一個(gè)特殊的角度，從各類(lèi)庫(kù)的頂層對(duì)象名的鍵盤(pán)輸入的體驗(yàn)上來(lái)對(duì)這三個(gè)類(lèi)庫(kù)進(jìn)行比較。
2010-10-10
原生JS仿QQ閱讀點(diǎn)擊展開(kāi)、收起效果
這篇文章主要為大家詳細(xì)介紹了原生JS仿QQ閱讀點(diǎn)擊展開(kāi)、收起效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2017-03-03
TS?中?never,void,unknown類(lèi)型詳解
這篇文章主要介紹了TS?中?never,void,unknown類(lèi)型詳解,never?類(lèi)型是 TypeScript 中的底層類(lèi)型，unknown是TypeScript中比較特殊的一種類(lèi)型，它用于描述類(lèi)型不確定的變量，本文給大家介紹的非常詳細(xì)，需要的朋友可以參考下
2023-05-05
js轉(zhuǎn)換對(duì)象為xml
本文主要介紹了js轉(zhuǎn)換對(duì)象為xml的方法。具有很好的參考價(jià)值，下面跟著小編一起來(lái)看下吧
2017-02-02