无限滚动从页面底部刷新两次 [英] Infinite scroll fired twice on refresh from the bottom of page

问题描述

我用下面的代码设置了无限滚动.

I have an infinite scroll set up with the following piece of code.

$(window).scroll(function () {
    if ($(window).scrollTop() >= $("#home_content").height() - $(window).height()) {
        if (isLastPage) {
            foo();
        } else {
            bar(); // JQuery AJAX call
        }
    }
});

这是在document.ready();内部； 当服务器发送最后一页的标志时，ajax调用不会发生.在正常情况下，这可以正常工作.但是，当我从页面底部按下F5(Refresh)时，同时触发了两个滚动事件，并且绕过了该标志(因为第二个调用甚至在设置标志之前就发生了)并加载了重复数据.

This is inside document.ready(); The ajax call doesn't happen when the server sends a flag for the last page. This works fine in a normal scenario. But when I press F5(Refresh) from the bottom of the page, two simultaneous scroll events are fired,and it bypasses the flag (as the second call happens even before the flag is set) and duplicate data is loaded.

我唯一知道的是它发生在document.ready()函数的末尾.任何人，任何想法吗?

The only thing i know is it happens at the end of document.ready() function. Anyone, any idea??

谢谢.

编辑

除此之外，没有太多相关的代码.

There is no much relevant code other than this.

这仅在FF 17中发生. 在IE 9中，当我快速向下滚动时，同一滚动被触发两次

And this happens only in FF 17. In IE 9 when I do a fast scroll down, same scroll is fired twice

推荐答案

这只是一种解决方法，因为我们看不到您的完整代码，但是也许可以帮忙:

This is just a workaround as we cannot see your complete code, but maybe thats can help:

var timeout;

$(window).scroll(function(){
      clearTimeout(timeout);
  timeout = setTimeout(function(){
      if  ($(window).scrollTop() >= $("#home_content").height() - $(window).height()){
                if (isLastPage){
                    foo();
                }else{
                    bar();//AJAX call
                }
            }
  },0);
});

这篇关于无限滚动从页面底部刷新两次的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！