废话不多说 直接撸
1.引入两个js文件,必须jquery第一个
<script src="jquery.min.js"/>
<script src="jquery.infinitescroll.min.js"/>
2.网页头写一个脚本
<script>
$(document).ready(function (){ //启动函数
$("#travel_list").infinitescroll({
navSelector: "#pagenavi",//页面分页元素(成功后自动隐藏)
nextSelector: "#pagenavi a",//下一页的导航
itemSelector: ".travel_single",//每次数据载入的地方
//animate: true,//加载的时候是否需要动画 默认false
loading:{//加载信息的显示配置
msgText:'<em>Loading the next set of posts...</em>'//默认加载数据时的提示信息
}
},function(e){
$(document.body).limit();
})
});
</script>
3.网页部分
<div class="travel_list" id="travel_list">
<div class="travel_single">
内容.......省略(分页的数据)
<div>
<div id="pagenavi" class="pagenavi">
<a href="请求地址?pageIndex=1"><a> //后台获取pageIndex,ok..... 大致流程结束
</div>
<div>
项目中用到了,备注一下。也可以帮助到其他朋友