手機網(wǎng)頁和PC網(wǎng)頁都可以使用的上拉加載更多內(nèi)容，其中LoadingDataFn自己改為ajax加載就可以了var?page?=?1,?//分頁碼

off_on?=?false,?//分頁開關(滾動加載方法?1?中用的)

timers?=?null;?//定時器(滾動加載方法?2?中用的)

//加載數(shù)據(jù)

var?LoadingDataFn?=?function()?{

var?dom?=?'';

for?(var?i?=?0;?i?

????????dom?+=?'

上滑列加載表內(nèi)容上滑列加載表內(nèi)容上滑列加載表內(nèi)容上滑列加載表內(nèi)容';

}

$('#list_box').append(dom);

off_on?=?true;?//[重要]這是使用了?{滾動加載方法1}??時?用到的?！！！[如果用??滾動加載方法1?時：off_on?在這里不設?true的話，?下次就沒法加載了哦！]

};

//初始化，?第一次加載

$(document).ready(function()?{

LoadingDataFn();

});

//底部切換

$(document.body).on('click',?'#footer?div',?function()?{

$(this).addClass('active').siblings().removeClass('active');

});

//滾動加載方法1

$('#main').scroll(function()?{

//當時滾動條離底部60px時開始加載下一頁的內(nèi)容

if?(($(this)[0].scrollTop?+?$(this).height()?+?60)?>=?$(this)[0].scrollHeight)?{

//這里用?[?off_on?]?來控制是否加載?(這樣就解決了?當上頁的條件滿足時，一下子加載多次的問題啦)

if?(off_on)?{

//off_on?=?false;

//page++;

//console.log("第"+page+"頁");

//LoadingDataFn();??//調(diào)用執(zhí)行上面的加載方法

}

}

});

//滾動加載方法2

$('#main').scroll(function()?{

//當時滾動條離底部60px時開始加載下一頁的內(nèi)容

if?(($(this)[0].scrollTop?+?$(this).height()?+?60)?>=?$(this)[0].scrollHeight)?{

clearTimeout(timers);

//這里還可以用?[?延時執(zhí)行?]?來控制是否加載?(這樣就解決了?當上頁的條件滿足時，一下子加載多次的問題啦)

timers?=?setTimeout(function()?{

page++;

console.log("第"?+?page?+?"頁");

LoadingDataFn();?//調(diào)用執(zhí)行上面的加載方法

},?300);

}

});

//還可以基window窗口(body)來添加滾動事件,?(因為布局不同,所以在這里沒效果，因為[上面是基于body中的某個元素來添加滾動事的])

$(window).scroll(function()?{

//當時滾動條離底部60px時開始加載下一頁的內(nèi)容

if?(($(window).height()?+?$(window).scrollTop()?+?60)?>=?$(document).height())?{

clearTimeout(timers);

timers?=?setTimeout(function()?{

page++;

console.log("第"?+?page?+?"頁");

LoadingDataFn();

},?300);

}

});

總結

以上是生活随笔為你收集整理的php中手机端ajax上拉加载更多,jQuery手机网页上拉加载更多的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。