时间:2021-07-01 10:21:17 帮助过:3人阅读
各位大神们下午好,我想在我的手机网站中添加跟新浪微博APP滚动条往下滑动加载更多数据功能,这个功能要怎么实现,请各位大神指点下我,有什么好的代码分享下,万分的感谢
这种模式叫做 Infinite Scroll, 各种框架和类库中都有比较成熟的实现,可以参考一下
思路很简单(其实实现也很简单),就是ajax后台请求数据,插入到文档后面,至于事你后台渲染好的html字符串还是后端之提供数据然后js进行渲染就无所谓
$.ajax({
....//略
success:function(data){
$('body').append(data)//这个意思
},
...
})
可以监视滚动条事件,距离底部100px就开始加载
$(window).scroll(function() {
if ($(document).scrollTop() + $(window).height() > $(document).height() - 100) {
$.get(url, function(data) {
$('#list').append(data);
});
}
});
监听滚动事件,在回调函数里加载更多图片
用iScroll.js配合ajax请求数据可以实现上拉加载,下拉刷新,可以试一试。