心系少时言 等一不归人
//*将Dom7导出到本地变量*
var $$ = Dom7;
//*初始化应用程序*
var myApp = new Framework7();
//*初始化视图*
var mainView = myApp.addView(".view-main",{
domCache: true
});
//*无限滚动*
// *加载flag*
var loading = false;
// *上次加载的序号*
var lastIndex = $$('dynamic_list').length;
// *最多可加载的条目*
var maxItems = 100;
//* 每次加载添加多少条目*
var itemsPerLoad = 3;
// *注册'infinite'事件处理函数*
$$('.infinite-scroll').on('infinite', function () {
// *如果正在加载，则退出*
if (loading) return;
//* 设置flag*
loading = true;
//* 模拟1s的加载过程*
setTimeout(function () {
// *重置加载flag*
loading = false;
if (lastIndex >= maxItems) {
// *加载完毕，则注销无限加载事件，以防不必要的加载*
myApp.detachInfiniteScroll($$('.infinite-scroll'));
// *删除加载提示符*
$$('.infinite-scroll-preloader').remove();
return;
}
// *生成新条目的HTML*
var html = '';
for (var i = lastIndex; i <= lastIndex + itemsPerLoad; i++) {
html += '<div class='dynamic_list'>这是新添加的元素</div>';
}
// *添加新条目*
$$('.dynamic').append(html);
// *更新最后加载的序号*
lastIndex = $$('.dynamic_list').length;
}, 1000);
});
其中'.dynamic'类为包裹将要添加的元素的父元素，'.dynamic_list'类为将要添加的元素的同胞元素。
需要在page-content类中再添加infinite-scroll类。
