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

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

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

//加載數據

var?LoadingDataFn?=?function()?{

var?dom?=?'';

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

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

上滑列加載表內容上滑列加載表內容上滑列加載表內容上滑列加載表內容';

}

$('#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時開始加載下一頁的內容

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

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

if?(off_on)?{

//off_on?=?false;

//page++;

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

//LoadingDataFn();??//調用執行上面的加載方法

}

}

});

//滾動加載方法2

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

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

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

clearTimeout(timers);

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

timers?=?setTimeout(function()?{

page++;

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

LoadingDataFn();?//調用執行上面的加載方法

},?300);

}

});

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

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

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

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

clearTimeout(timers);

timers?=?setTimeout(function()?{

page++;

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

LoadingDataFn();

},?300);

}

});

總結

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

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。