在Scroll Position上进行Ajax调用时，如何阻止功能崩溃？

问题描述

| 这是我正在处理的项目的URL： http://www.buymyoldiphone.com/Ajax_Tests/TodTom/Social%20V2.0/NEW/index.html 当滚动条位于页面下方约3/4时，我试图允许它加载新内容（使用Ajax）：

$(window).scroll(function () { 

    var height = $(window).height();
    var scrollTop = $(window).scrollTop();                                     

    if(scrollTop > (height*3)) {
        numRes = numRes + 20;
        reloadContent();
    }
});

但是正如您所看到的（如果您查看URL），它会发疯直到一切消失。 还有编码建议？ 编辑 该功能似乎可以正常工作：

$(\'#loadmore_btn\').live(\'click\',function() {
        numRes = numRes + 20;
        reloadContent();
});

    

解决方法

        几天前我遇到了同样的问题。这是我固定的方式： 1）就在document.ready的开头，我这样说：

$(\'body\').data(\'isAJAX\',false);
$(\'body\').ajaxStart(function(){
    $(\'body\').data(\'isAJAX\',true);
}).ajaxStop(function(){
    $(\'body\').data(\'isAJAX\',false);
});

2）然后，当我打ajax时，我只是检查：

if(!$(\'body\').data(\'isAJAX\')){ 
// make my ajax call
}

当然，我只有一个可能的ajax调用，所以对我来说很容易，但是...它也可能对您有帮助:)     ,        设置超时以延迟调用ajax。

var _timeout;

$(window).scroll(function () { 
    clearTimeout(_timeout);
    var height = $(window).height();
    var scrollTop = $(window).scrollTop();                                     

    if(scrollTop > (height*3)) {
        numRes = numRes + 20;
        _timeout = setTimeout(function(){
                   reloadContent();
                },50);
    }
});

超时时间不必太长，因为滚动事件会触发很多操作，因此可以稍微延迟一下通话时间。     ,        解决了我的问题， 事实证明，scrollTop不会给您向下的距离比例，而只是一个数字来表示您的滚动位置-因此，如果您在页面上3/4处滚动，并且加载了50％的内容，scrollTop编号将保持不变如果您的滚动位置没有移动，则相同。总滚动距离仅增加50％。 因此，我决定使用包装所有文档元素的容器高度来表示总滚动距离，而我发现距离的比率（scrollTop / Total Distance）为.75来表示页面加载。

$(window).scroll(function () { 

    var height = $(window).height();
    var scrollTop = $(window).scrollTop(); 
    var scrollAll = $(\'#container\').height();
    var scrollRatio = (scrollTop/scrollAll);

    if(scrollRatio > .75) {
            if(!$(\'body\').data(\'isAJAX\')){ 
                numRes = numRes + 20;
                eReload = 1; //reload all content
                AddOr = 1;
                reloadContent();
                //alert(scrollRatio) will always be around .75
            }
    }
});

感谢lonut Staicu提供了以上代码，以使该功能平稳运行