基于JQuery實(shí)現(xiàn)滾動(dòng)到頁(yè)面底端時(shí)自動(dòng)加載更多信息
關(guān)鍵代碼:
var stop=true;
$(window).scroll(function(){
totalheight = parseFloat($(window).height()) + parseFloat($(window).scrollTop());
if($(document).height() <= totalheight){
if(stop==true){
stop=false;
$.post("ajax.php", {start:1, n:50},function(txt){
$("#Loading").before(txt);
stop=true;
},"text");
}
}
});
HTML:
<div id="Loading">Loading...</div>
實(shí)現(xiàn)方法是比較頁(yè)面總高度和下滾高度以判斷是否到達(dá)底端,若到達(dá)底端則通過(guò)ajax讀取更多的內(nèi)容,用before插入到Loading之前。
stop參數(shù)是考慮到ajax讀取耗時(shí),防止在一次ajax讀取過(guò)程中多次觸發(fā)事件,造成多次加載內(nèi)容。
相關(guān)文章
Jquery動(dòng)態(tài)進(jìn)行圖片縮略的原理及實(shí)現(xiàn)
圖片縮略在某些情況下還是比較實(shí)用的,比如在做一些商品的預(yù)覽圖縮略等等,下面為大家介紹下具體的實(shí)現(xiàn)思路及代碼,有需求的朋友可以參考下2013-08-08
jquery二級(jí)導(dǎo)航內(nèi)容均分的原理及實(shí)現(xiàn)
頭部導(dǎo)航二級(jí)導(dǎo)航有些內(nèi)容太長(zhǎng),一列的話太過(guò)難看,就要分成兩列,要做到按塊盡量均分,排列順序沒(méi)有限制2013-08-08
jq源碼解析之綁在$,jQuery上面的方法(實(shí)例講解)
下面小編就為大家?guī)?lái)一篇jq源碼解析之綁在$,jQuery上面的方法(實(shí)例講解)。小編覺(jué)得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-10-10
利用jQuery treetable實(shí)現(xiàn)樹(shù)形表格拖拽詳解
這篇文章主要為大家介紹了如何利用jQuery treetable實(shí)現(xiàn)樹(shù)形表格拖拽功能,文中的示例代碼講解詳細(xì),感興趣的小伙伴可以動(dòng)手嘗試一下2022-06-06
jQuery鼠標(biāo)移動(dòng)圖片上實(shí)現(xiàn)放大效果
這篇文章主要介紹了jQuery鼠標(biāo)移動(dòng)圖片上實(shí)現(xiàn)放大效果 ,需要的朋友可以參考下2017-06-06
JQuery拖動(dòng)表頭邊框線調(diào)整表格列寬效果代碼
當(dāng)鼠標(biāo)停留在表頭邊框線上,接著拖動(dòng)鼠標(biāo),會(huì)在表格中出現(xiàn)一條隨鼠標(biāo)移動(dòng)的豎線,最后放開(kāi)鼠標(biāo),表格列寬會(huì)被調(diào)整2014-09-09
jQuery中clone()函數(shù)實(shí)現(xiàn)表單中增加和減少輸入項(xiàng)
這篇文章給大家介紹了jQuery中clone()函數(shù)實(shí)現(xiàn)表單中增加和減少輸入項(xiàng)的實(shí)例代碼,非常不錯(cuò),具有參考借鑒價(jià)值,需要的朋友參考下吧2017-05-05
通過(guò)jQuery打造支持漢字,拼音,英文快速定位查詢的超級(jí)select插件
jQuery 超級(jí)select 插件 v3.0.0.0插件 支持漢字、拼音、英文快速定位查詢的超級(jí)select插件。可方向鍵、tab 鍵快速選擇。2010-06-06
使用jQuery動(dòng)態(tài)設(shè)置單選框的選中效果
這篇文章主要介紹了使用jQuery動(dòng)態(tài)設(shè)置單選框的選中效果,本文給大家介紹的非常詳細(xì),具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2018-12-12

