页面加载后，Jquery，Django，Infinite Scroll 加载其余元素

Posted 2023-05-07

【中文标题】页面加载后，Jquery，Django，Infinite Scroll 加载其余元素

【英文标题】：Jquery, Django, Infinite Scroll load rest of elements after page is loaded

【发布时间】：2019-08-09 19:56:19

【问题描述】：

按照本指南，我能够在我的 Django 网站主页中实现无限滚动： https://simpleisbetterthancomplex.com/tutorial/2017/03/13/how-to-create-infinite-scroll-with-django.html

基本上触发无限滚动的Jquery代码是这样的（加上一些django代码）：

<script>
  var infinite = new Waypoint.Infinite(
  element: $('.infinite-container')[0]
  );
</script>

这很好，因为我加载页面非常快，然后用户可以在加载其他元素时无限滚动。 我现在想要实现的是像现在和之后一样加载页面，而不需要向下滚动，我想加载其余的元素。 所以基本上用前几个元素加载页面，然后加载所有剩余的元素而无需滚动。 请注意，我使用了上述指南的实现，因为它是一种能够使用 Django 的所有功能（尤其是与外键相关）的便捷方式，因此我试图坚持这种方法。

有没有办法改变只触发 Jquery 的内容？

谢谢， 维托里奥

【参考方案1】：

Waypoint.Infinite 是一个你应该阅读文档的库。假设在到达底部时触发加载，您可以在页面加载时使用 Jquery 滚动到底部。

$('html, body').scrollTop($(document).height());

【讨论】：

感谢您的回答，但我希望它“静默”地加载这些元素。所以基本上，当用户看到初始页面时，底部元素需要静默加载。

我看不到在前端库文档中触发加载事件的方法；也许尝试在他们的 github 问题中询问如何做到这一点。或者只是用jquery实现它，你需要做的就是在每次滚动到底部时触发ajax，老实说，你不需要依赖来这样做。