1

我正在做一些类似无限画廊的事情。我的 OnScroll 函数检测滚动是否位于页面底部 100px 处，如果是，则执行 ajax 调用，并且我将输出附加到 div。

问题是 closeToBottom 函数太快了，所以它有时会在滚动向上反弹之前从底部捕获滚动 100 像素两次甚至 4-5 次。

如何使 closeToBottom 更加微妙，以便一次只调用一次我的 ajax 调用，并且滚动会立即向上踢？

function onScroll(event) {
    // Check if we're within 100 pixels of the bottom edge of the browser window.
    var closeToBottom = ($(window).scrollTop() + $(window).height() > $(document).height() - 100);
    if(closeToBottom) {

        $.ajax({

                url: "<?php echo get_template_directory_uri() ?>/ajaxcall.php?offset="+offset,
                cache: false
        }).done(function( html ) {
            offset = offset + numberposts;
            $("#tiles").append(html);


        });
}
4

1 回答 1

2

您可以引入一个在 ajax 请求运行时设置的变量，并且仅在没有其他请求运行时启动另一个变量。像这样：

var ajaxLoading = false;
function onScroll(event) {
    // Check if we're within 100 pixels of the bottom edge of the browser window.
    var closeToBottom = ($(window).scrollTop() + $(window).height() > $(document).height() - 100);
    if(closeToBottom && !ajaxLoading) {
        ajaxLoading = true;
        $.ajax({

                url: "<?php echo get_template_directory_uri() ?>/ajaxcall.php?offset="+offset,
                cache: false
        }).done(function( html ) {
            offset = offset + numberposts;
            $("#tiles").append(html);
            ajaxLoading = false;

        });
}
于 2012-04-07T09:02:19.770 回答