快捷導(dǎo)航

異步加載技術(shù)實(shí)現(xiàn)當(dāng)滾動條到最底部的瀑布流效果

更新時(shí)間：2014年09月16日 16:22:41 投稿：whsnow

當(dāng)滾動條到最底部的時(shí)候觸發(fā)一個(gè)事件，這個(gè)事件寫入$.get()事件，實(shí)現(xiàn)瀑布流效果，下面試具體的實(shí)現(xiàn)

異步加載技術(shù)實(shí)現(xiàn)瀑布流效果。當(dāng)滾動條到最底部的時(shí)候觸發(fā)一個(gè)事件，這個(gè)事件寫入$.get()事件，向內(nèi)部程序頁傳遞類別id和頁碼，程序?qū)祷啬莻€(gè)類別下的相對頁的產(chǎn)品列表，如果程序查詢當(dāng)前類無產(chǎn)品即返回空。

滾動條事件要寫在window.onscroll中才有效判斷。如下：

window.onscroll=function(){<br>　　　　
// var scrolltop=document.documentElement.scrollTop||document.body.scrollTop;
var tops = $(document).scrollTop(); //獲取滾動條的位置
var sctop = $(document).height()-$(window).height();
var id = $("#ajax_claid").val();
if(!id){
id=8;
}
$("#ajax_p").val(tops);
if(tops>=sctop)//成立說明滾動條已在最底部
{
var b=$("#ajax_p").val();
if(b>a){
page=page+1;//傳遞頁碼
}
var Url = "aja_pro/"+id+"/"+page;//程序頁面，查詢信息返回?cái)?shù)據(jù)，直接返回帶html的信息。

$.get(Url,function(data){
$("#aja_jia").append(data);
});

}
};

您可能感興趣的文章:

相關(guān)文章

php中isset與empty函數(shù)的困惑與用法分析
這篇文章主要介紹了php中isset與empty函數(shù)的困惑與用法,結(jié)合實(shí)例形式分析了php中isset與empty函數(shù)的功能、用法、區(qū)別及相關(guān)使用注意事項(xiàng),需要的朋友可以參考下
2019-07-07
使用Memcached緩存實(shí)現(xiàn)Session共享技巧
這篇文章主要為大家介紹了使用Memcached緩存實(shí)現(xiàn)Session共享技巧,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪
2023-11-11
php+html5基于websocket實(shí)現(xiàn)聊天室的方法
這篇文章主要介紹了php+html5基于websocket實(shí)現(xiàn)聊天室的方法,實(shí)例分析了php結(jié)合html5的websocket通訊的使用技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下
2015-07-07
php中jpgraph類庫的使用介紹
以下是對php中jpgraph類庫的使用進(jìn)行了詳細(xì)的分析介紹，需要的朋友可以過來參考下
2013-08-08
PHP隨機(jī)生成信用卡卡號的方法
這篇文章主要介紹了PHP隨機(jī)生成信用卡卡號的方法,涉及php根據(jù)信用卡卡號規(guī)則生成卡號的技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下
2015-03-03
php構(gòu)造函數(shù)與析構(gòu)函數(shù)
PHP析構(gòu)函數(shù)與構(gòu)造函數(shù)是相反的，它們被調(diào)用來一個(gè)對象從內(nèi)存中銷毀，幫助我們釋放對象屬性所占用的內(nèi)存并銷毀對象相關(guān)的資源。
2016-04-04
php實(shí)現(xiàn)刪除空目錄的方法
這篇文章主要介紹了php實(shí)現(xiàn)刪除空目錄的方法,實(shí)例分析了rmdir函數(shù)的使用技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下
2015-03-03
ajax取消掛起請求的處理方法
ajax取消掛起請求的處理方法，需要的朋友可以參考一下
2013-03-03
php實(shí)現(xiàn)從ftp服務(wù)器上下載文件樹到本地電腦的程序
功能：完成從ftp服務(wù)器端下載文件到本地電腦（整體復(fù)制即目錄樹是一樣的）
2009-02-02
PHP PDO和消息隊(duì)列的個(gè)人理解與應(yīng)用實(shí)例分析
這篇文章主要介紹了PHP PDO和消息隊(duì)列的個(gè)人理解與應(yīng)用,結(jié)合實(shí)例形式分析了PHP pdo與消息隊(duì)列相關(guān)配置、使用方法及操作注意事項(xiàng),需要的朋友可以參考下
2019-11-11