缘起:最近研究上拉刷新,记录下自己实现的一个超简易版,大概记录下原理;
github: https://github.com/dclnet/UpRefresh 代码和demo都在这,有需要的可以看看。
原理: 这个实现比较简单,就是父div块固定高度,子div块不定高度,父块绑定onscroll事件处理,event里面scrollTop获取当前滚动到的距离加父块高度看是不是等于子块高度,等于则标明已经滚动到底了,然后触发上拉刷新,就这么简单。
使用是直接引入UpRefresh.js文件就好,其他样式可以参考着demo写,初始化代码:
new UpRefresh({
wrapId: '#wrap', // 定高父块
childId: '#list', // 变高子块
init: function(){ // 执行些初始化工作 },
up: function() { // 上拉执行call }
});
因为是超简易版实现,所以也没在太多平台测试,有疑问和bug的可以留言哈~