此 jquery 代码中的小逻辑问题：使用 jquery “加载”更多页面答案

【问题标题】：small logical issue in this jquery code: "load" more pages with jquery此 jquery 代码中的小逻辑问题：使用 jquery “加载”更多页面
【发布时间】：2014-10-20 10:23:21
【问题描述】：

我在新闻索引页面中有许多 article div，其中每个 div 都包含一个新闻预告片。

我想显示前 10 个，然后在向下滚动并到达底部时，我将显示另外 10 个等。这是我的 js。

$(function () {
  shown = 0;
  $('.artikel').hide();
  $('.artikel').each(function () {
    if (shown <= 10) {
        shown += 1;
        $(this).show();
    }
  });
  $(window).scroll(function () {
    if ($(window).scrollTop() + $(window).height() == $(document).height()) {

        setTimeout(function () {
            // problem here. 
            $('.artikel').each(function () {
                if (shown <= 20) {
                    shown += 1;
                    $(this).show();
                }
            });


        }, 1500);
    }
  });
});

我的逻辑问题是，一旦我滚动到底部，setTimeOut 中的函数将从头开始再次计算所有articles。

我希望它显示从最后显示的文章开始的下 10 条新闻。有人可以帮忙吗？

【问题讨论】：

在你的 if 语句之后添加 shown += 10 ，它应该在每次刷新时添加 10。

标签： javascript jquery html

【解决方案1】：

您可以找到第一个隐藏的文章，然后显示以下 10 篇文章，这样您就不必计算到目前为止已经显示了多少：

var shownCount = 0;

$('.artikel:not(:visible)').each(function () {
    if (shownCount <= 10) {
        shownCount += 1;
        $(this).show();
    }

【讨论】：