当滚动到页面的底部100px时，jQuery加载内容，多个事件被触发

我想要一个事件在用户滚动时加载更多内容并且几乎到达页面底部，比如从底部开始大约100px，问题是每次滚动页面的下部100px时事件都会被触发，因为显而易见的原因，这是一个不可能发生的明显问题，所以我想知道如何做到最好，我已经在这里检查了其他答案/问题，但是部分工作的一个解决方案并不符合我的需要要做，当我尝试改变它，它会，它每次完全冻结我的浏览器。 这是一个问题： 检查用户是否已滚动到底部

我正在看的答案接近底部，但这是他建议的代码：

$(window).scroll(function() { if($(window).scrollTop() + $(window).height() > $(document).height() - 100) { $(window).unbind('scroll'); alert("near bottom!"); } }); 

就像我说的那样，这确实有效，并且可以防止多个事件被触发，问题是我需要触发无数的事件，比如我到达底部时加载100行信息​​，但仍有1500多个，我需要它重复每次加载每一个信息量（一旦你到达页面的底部100px部分每次）

所以我试图做的是：

  function loadMore() { alert("More loaded"); $(window).bind('scroll'); } $(window).scroll(function() { if($(window).scrollTop() + $(window).height() > $(document).height() - 100) { $(window).unbind('scroll'); loadMore(); } }); 

就像我说的那样，每次都会立即冻结我的浏览器，绑定部分。

Answer 1

我也有同样的问题。 我遇到了这个链接 ，它确实帮助（和工作）！

更新：我查看了代码，我认为当你重新绑定时，你错过了重新绑定的function。

的jsfiddle

  function loadMore() { console.log("More loaded"); $("body").append("
"); $(window).bind('scroll', bindScroll); } function bindScroll(){ if($(window).scrollTop() + $(window).height() > $(document).height() - 100) { $(window).unbind('scroll'); loadMore(); } } $(window).scroll(bindScroll); 

Answer 2

这对你有所帮助。

浏览此链接以获取整篇文章，并详细介绍如何触发多个事件。

当浏览器在jquery中滚动到页面末尾时加载更多内容

Answer 3

我遇到了同样的问题。 为了解决它，我使用underscore.js库来防止多个事件被触发。 链接在这里。 http://underscorejs.org/#throttle