【发布时间】:2017-04-11 23:05:11
【问题描述】:
我真的不明白我应该如何在我的网站中实现无限滚动功能。我理解它的目的,但也许 Trevor 对该函数的作用进行更多的技术解释将使我能够理解它并以更有效的方式实现它。此外,非常感谢您将其与网站其余部分的上下文一起使用的示例。
提前致谢,
帕尔默
【问题讨论】:
标签: web-applications infinite-scroll kik
我真的不明白我应该如何在我的网站中实现无限滚动功能。我理解它的目的,但也许 Trevor 对该函数的作用进行更多的技术解释将使我能够理解它并以更有效的方式实现它。此外,非常感谢您将其与网站其余部分的上下文一起使用的示例。
提前致谢,
帕尔默
【问题讨论】:
标签: web-applications infinite-scroll kik
这个问题似乎与 App.js(开源移动 UI 库)有关,而不是 Kik 浏览器和 API...
不管怎样,下面是一个示例页面,它会在用户滚动时将项目动态加载到列表中。
HTML:
<div class="app-page" data-page="home">
<div class="app-topbar">
<div class="app-title">Title</div>
</div>
<div class="app-content">
<ul class="app-list"></ul>
</div>
</div>
JS:
App.populator('home', function (page) {
var pageNum = 0;
App.infiniteScroll($(page).find('.app-list'), function (next) {
pageNum++;
$.ajax({
url: 'url/to/data?page='+pageNum,
success: function (data) {
var list = [];
data.items.forEach(function (item) {
var li = $('<li>');
//TODO: construct list item from data
list.push(li);
});
next(list);
}
});
});
});
【讨论】: