iScroll 库 - 到达页面末尾 - 回调还是绑定?

发布于 2024-12-17 15:59:52 字数 201 浏览 3 评论 0原文

我试图在 iScroll 容器到达页面底部(Y 轴)时挂钩函数回调。这样我就可以按需加载更多内容 - 而不是全部 300 多个内容。

有人做过这方面的工作吗?有什么提示吗?

这是我引用的库: http://cubiq.org/iscroll-4

I'm trying to hook function callback when iScroll container reaches end of page, at the bottom end (Y-axis). So that I can load more content on demand - instead of all 300+ contents.

Has anybody worked on it? Any hints?

Here is the library I was referring to: http://cubiq.org/iscroll-4

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

蝶舞 2024-12-24 15:59:52

正如 drmatt 提到的,您应该查看拉动刷新演示

http://cubiq。 org/dropbox/iscroll4/examples/pull-to-refresh/

您需要构建自己的逻辑,不需要用户拉动来添加更多项目。

类似于以下内容(伪代码 - 未经测试的代码):

var isAlreadyLoading = 0;
var iscroller = new iScroll(
'your-element-id', 
  { 
    hScroll: false, 
    bounce: false, // do not bounce
    onScrollMove: function () {
      // CHECK if we've 350px gap before reaching end of the page
      if ( (this.y < (this.maxScrollY + 350)) && (isAlreadyLoading == 0) ){ 
        // start loading next page content here

        // update this flag inside load more and set to 0 when complete
        isAlreadyLoading = 1; 
      }
    },
    onScrollEnd: function () {
      // check if we went down, and then load content
      if ( isAlreadyLoading == 0 ) {
        // Load more content

        // update this flag inside load more and set to 0 when complete
        isAlreadyLoading = 1; 
      } else {
        // DO NOTHING
      }
    }
  } // end of Scoller config object
); // end iScroll instance

As drmatt metioned, you should look into Pull to refresh demo

http://cubiq.org/dropbox/iscroll4/examples/pull-to-refresh/

You need to build you own logic which won't require user to pull to add more items.

Something like following (pseudo code - not tested code):

var isAlreadyLoading = 0;
var iscroller = new iScroll(
'your-element-id', 
  { 
    hScroll: false, 
    bounce: false, // do not bounce
    onScrollMove: function () {
      // CHECK if we've 350px gap before reaching end of the page
      if ( (this.y < (this.maxScrollY + 350)) && (isAlreadyLoading == 0) ){ 
        // start loading next page content here

        // update this flag inside load more and set to 0 when complete
        isAlreadyLoading = 1; 
      }
    },
    onScrollEnd: function () {
      // check if we went down, and then load content
      if ( isAlreadyLoading == 0 ) {
        // Load more content

        // update this flag inside load more and set to 0 when complete
        isAlreadyLoading = 1; 
      } else {
        // DO NOTHING
      }
    }
  } // end of Scoller config object
); // end iScroll instance
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文