等待无限滚动完成加载-Javascript

Question

我正在使用“无限滚动”页面，当用户滚动到页面底部时，该页面最多调用40个元素。 如何检测最新组中所有内容的加载时间？

这仅适用于初始页面加载：

$(window).load(function() {
    // Do something
});

在页面已完成加载很长时间之后进行“加载”时，是否有类似的东西？

很抱歉，如果这是另一个问题的重复。 我在其他任何地方都找不到解决方案。

Answer 1

经过更多的挖掘之后，我使用了这个问题/答案的变体。

我的最终结果看起来像这样：

function ($container, previousCount, callback) {
    var _imgs = $container.find('img'),
        _newImages = _imgs.slice(previousCount), // 'start index' for new images
        imgCount = _newImages.length, // count how many new ones exist
        counter = 0;

    _imgs.on('load', function() { // Count loaded
        runCallback(20, callback);
    }).on('error', function() { // Count errors, anyway, to reach total
        runCallback(20, callback);
    });

    function runCallback(counterLimit, callback) {
        // if counter meets new count or hits counter limit, run callback
        counter++;
        if (counter == imgCount || counter == counterLimit) {
            callback();
        }
    }
}

为什么我需要这种方式有些奇怪。 previousCount实际上可以大于DOM中当前的图像总数，这是因为人们可以跳过无限滚动的不同部分。 因此，还需要检查counter == counterLimit 。

另外，当新图像集加载完成时，无论它们成功还是失败，我都需要运行一个脚本。 这就是为什么我同时使用.on('load'和.on('error'来计数的原因。我注意到有时图像可能会出错（在这种情况下很好），它将放弃计数，从不触发回调。

==================

编辑04/27/16：从那以后，我发现了一个可以为您处理此问题的插件，并且似乎运行良好（除了之前加载完成之前的几个后续加载）。 检出imagesLoaded 。