Question

我正在制作无限滚动页面。有时候这段代码工作得很完美，有时它首先加载第13页，当它首先加载第1页（第0页，索引，已经加载），然后第2页，第3页，第4页等，当用户距离页面底部400px时。有时页面会同时加载两次，因此它会增加1,2,2,3,4,5,5,6

我将async设置为true，但希望它为false。 false的问题是冻结页面。为了绕过这个，我添加了变量'loadingMoreOpps'。在调用.ajax（）之前，loadingMoreOpps必须为false，并在与滚动位置检查相同的条件语句中进行检查。

    var loadingMoreOpps = false;
    var oppPagesLoaded = 1;
    $(window).scroll(function () {
        if (($(window).scrollTop() + $(window).height() >= ($(document).height() - 400)) && !loadingMoreOpps) {                     
            loadingMoreOpps = true;
            $.ajax({
                type: 'POST', 
                url: 'templates/opportunities/loadmore.php', 
                data: { page: oppPagesLoaded }, 
                beforeSend: function(response) {
                },
                dataType: 'html',
                async: true
                }).
                    done(function(response) {
                            $('#opp_container').append(response);
                            loadingMoreOpps = false;
                            oppPagesLoaded++;
                    }
                );
            }
    })");

Answer 1

当我再次加载页面时问题是oppPagesLoaded没有重置为1，因为我的Web应用程序基于AJAX。

要解决此问题，我只需添加oppPagesLoaded = 1;，而无需在相关代码块的顶部重新声明变量。

jQuery .ajax（）async没有冻结

1 个答案: