Javascript 当无限滚动更新页面内容时，下一幅图像不起作用

我使用fancybox 3和infinite sctoll。当我向下滚动时，一切正常。但如果我打开1个图像并按下下一步按钮，则由

$infScroll.infiniteScroll（'loadNextPage'）加载的项目位于页面上，但在当前页面的末尾，“下一步”按钮不会打开下一个图像。如果关闭当前弹出窗口并再次打开，则可以在下一页之前进入下一页。为什么“下一步”按钮无法动态添加项目

$('.gallery').fancybox({
    selector : ".img-box",
    ...
    ,
    afterShow: function(instance, item){
        if (item.index  >=  instance.group.length - 10) {
            $infScroll.infiniteScroll('loadNextPage');
        }
    }
});

从页面添加/删除项目不会自动影响当前打开的fancybox库。您需要手动更新库-

// Call `createGroup` with collection of fresh links 
$.fancybox.getInstance().createGroup( $('.img-box')  );

// Update controls
$.fancybox.getInstance().updateControls();

非常感谢。它起作用了，但不太好。奇怪的是，在这个instance.group之后，它包含元素的初学者工具包+初学者工具包+新元素。示例：…添加了新元素。instance.group=并在html页面中启动elemets而不是加倍。如果关闭fancybox gallery并再次打开，则所有工作正常。您应该将$（'.img box'）替换为“新链接集合”，因为“createGroup”方法会将元素添加到当前组中。我很高兴我发现了这一点，因为选择器文档中的“动态”措辞也让我感到困惑。在当前版本（3.5.7）中，“createGroup”是正确的吗？我在源代码中找不到它，但我找到了一个“addContent”函数，它似乎现在就可以完成（包括调用updateControl）。是的，没错，现在可以使用
addContent
方法。“动态”与您从vue/react中所期望的不同，它意味着脚本只是将单击事件附加到选择器，以便它也可以用于将来添加的项目。