0

我在不同的应用程序中看到了带有标记的无限滚动的实现。我认为这些应用程序是用 Objective-c 编写的，但我想知道是否有 jquery 等价物（或 js 库）。

我正在寻找的是一个无限滚动，带有一些数据的组标记。例如，显示一天的所有事件。组标记显示“今天”和当天的事件列表。滚动后，显示“明天”的标记并替换“今天”等。

在这里执行此操作的应用程序示例

是否有一个 jquery 库这样做？我找不到标记的正确术语（今天，明天），所以这也许就是为什么我找不到关于 stackoverflow 的讨论的原因。组标记是描述它的好方法吗？

4

1 回答 1

4

如果我理解正确，它可以完成。我不知道这是否完全 100% 相似，但它很接近。

jQuery Mobile 有一个叫做 listview 分隔符的东西，它们可以动态实现。

假设您从服务器动态提取数据，并且列表视图已填充但未刷新。您的列表视图内容如下所示：

<ul data-role="listview" id="MessagesList" data-autodividers="true">
    <li date="2013-03-03"><a href="#">Event 1</a></li>
    <li date="2013-03-02"><a href="#">Event 2</a></li>
    <li date="2013-03-01"><a href="#">Event 3</a></li>
</ul>

现在，在刷新和增强列表视图标记之前，您将初始化自动分隔符的生成，如下所示：

$("#MessagesList").listview({
    autodividers: true,
    autodividersSelector: function (li) {
        var out = li.attr('date');
        return out;
    }
}).listview('refresh');

你会得到这样的东西：jsFiddle

现在，至此我们已经解决了您的第一个问题。现在，关于你的第二个问题。您可以在名为Waypoints的 jQuery 插件的帮助下实现 listview 无限滚动。它可以用来检测listview已经到达底部，然后它会触发一个事件，该事件可以用来拉另一组动态数据，增强过程将重新开始。

或者你可以看看我的旧示例，看看它是如何手动完成的（我更喜欢这个解决方案而不是航点，它有更好的检测）：jsFiddle

于 2013-05-04T08:37:20.297 回答