jQuery无限滚动忽略浏览器弹出

我有一个函数，根据页码一次加载5个项目。但实际情况是，当用户滚动到页面底部时，$.post函数启动一次，然后在浏览器弹出完成时再次启动，因为

position\u bot==$（document）.height（）

实际上两次为真。然后每次加载10个项目

我正试图找到一种方法来忽略浏览器跳出的情况，以便只触发一次呼叫。 任何建议或帮助都会很好

$(function(){
    $('#loading').show();
    var page = 1,
        total_brands = '<?php echo $brandsCount?>',
        post_link = '<?php echo $brandsUrl?>',
        post_data = {page_num: page};

    $.post(post_link, post_data, function(data){
        $('.brandsResult').append(data);
        $('#loading').hide();
    });

    $(window).scroll(function (e) {

        var position_bot = $(window).scrollTop() + $(window).height(),
            displayed_brands = $('ul.category-list > li').length;               

        // Show loading image if near bottom
        if(position_bot > $(document).height() - 120 && displayed_brands < total_brands) {
            $('#loading').show();
        }

        // If page is at the bottom
        if(position_bot == $(document).height()) {

            // Increase page number
            page++;
            post_data = { page_num: page };
            console.log('page', page);

            // Check if all items are displayed
            if((page-1) * 5 > total_brands){
                $('#loading').hide();
            } else {    
            // Firing twice ???
                $.post(post_link, post_data, function(data){
                    $('#loading').hide();
                    $('.brandsResult').append(data);
                });

            }

        }
    });
});

$（函数（）{
$（“#加载”）.show（）；
变量页=1，
品牌总数=“”，
post_链接=“”，
post_data={page_num:page}；
$.post（post_链接、post_数据、函数（数据）{
$（'.brandsResult'）。追加（数据）；
$（“#加载”）.hide（）；
});
$（窗口）。滚动（功能（e）{
var position_bot=$（窗口）.scrollTop（）+$（窗口）.height（），
显示的品牌=$（'ul.category-list>li'）。长度；
//如果靠近底部，则显示正在加载的图像
if（position\u bot>$（document）.height（）-120&&displated\u brands品牌总数）{
$（“#加载”）.hide（）；
}否则{
//开火两次？？？
$.post（post_链接、post_数据、函数（数据）{
$（“#加载”）.hide（）；
$（'.brandsResult'）。追加（数据）；
});
}
}
});
});

我会设置一个布尔值来控制加载状态，如果为真，我会告诉代码不要做任何事情

    var processing = false;

if(position_bot == $(document).height() && !processing) {

    if((page-1) * 5 > total_brands){
       $('#loading').hide();
       processing = false;
    } else {    
       processing = true;
       $.post(post_link, post_data, function(data){
           $('#loading').hide();
           $('.brandsResult').append(data);
           processing = false;
       });

    }
}

---

我相信这是因为$（“#loading”）.show（）正在推动屏幕，充当高度的变化，这不足以推动屏幕超出条件的边界。一个简单的布尔值将（或可能）阻止这种情况。它可能需要一些调整，这只是一个基本的、完全未经测试的示例。

谢谢，这确实有效。您还指出，显示加载程序实际上可能也是一个问题，这也很好，但看起来浏览器反弹回来了，它触发了另一个调用。或者您可以尝试加载元素的绝对位置z索引。例如，如果它是绝对屏幕和中央屏幕，它将不会推动屏幕。这当然取决于你的设计。