无限滚动在谷歌浏览器中不起作用

Question

我有以下脚本使页面从数据库中获取更多记录并在页面末尾加载它们。 它在 Mac 上的 Safari 10.0 中运行良好，但不适用于 Google Chrome 53.0.2785.143。 如果我将 Chrome 浏览器窗口缩小到几乎智能手机的大小，它就会开始工作。

控制台不工作时没有任何内容，因此没有任何错误可以调试。 如果我查看 Web 服务器日志，则当我尝试向下滚动页面时没有请求，因此根本没有发生任何事情。

这是脚本：

 < script type = "text/javascript" > var skip = 20; var action = "<?php echo $action ?>"; $(window).scroll(function() { if ($(window).scrollTop() == $(document).height() - $(window).height()) { loadArticle(skip); skip += 20; } }); function loadArticle(pageNumber) { $('#inifiniteLoader').show('fast'); $.ajax({ url: "getMoreEvents.php", type: 'POST', data: "action=" + action + "&skip=" + skip, success: function(html) { $('#inifiniteLoader').hide('1000'); $("#content").append(html); // This will be the div where our content will be loaded } }); return false; } < /script>

Answer 1

$(window).scroll(function() {
  if ($(window).scrollTop() >= $(document).height() - $(window).height()) {
    loadArticle(skip);
    skip += 20;

Answer 2

我没有足够的声誉来发表评论，因此将其放在此处：

我认为Chrome的53.0.2785.143版本存在滚动顶部错误。 我的代码工作正常，然后在chrome中停了下来。

scrollTop已停止在Chrome中工作

Answer 3

我有完全相同的问题。 它适用于我尝试过的每个浏览器，甚至适用于在本地服务器上运行的 chrome，但当我将我的项目部署到在 https 安全服务器上运行的 Heroku 时则不然。 这种行为似乎是 Chrome 上的一个错误，这非常令人讨厌。

解决方案是在页面结束之前调用该函数，并有一个小的“间隙”。

解决方案在这里： Vytaliy Makovyak 的解决方案