jquery - jQuery无限滚动加载一直

Question

我看不出我做错了什么。但是我用来在滚动时加载更多图像的代码无法正常工作。ajax 请求完美无缺，但是当我触摸滚动条时，代码加载图像一直存在很大问题。我希望它在我到达页面底部时加载新图像，而不是每次触摸滚动时加载。

编码：

<script type="text/javascript">
    $(window).scroll(function() {
        if($(window).scrollTop() + $(window).height() >= $(document).height() -300) {

            $('div#more').show();
            $.ajax({
                url: "more.php?last=" + $('.fap:last').attr('id'),
                success: function(html) {
                    if (html) {
                        $('#photos').append(html);
                        $('div#more').hide();
                    }
                    else {
                        $('div#more').replaceWith('<center>No more images</center>')
                    }
                }
            });
        }
    });
</script>

任何人都知道我该如何解决这个问题？

Answer 1

也许一个信号变量可以做到这一点：

var is_loading = false;
$(window).scroll(function() {
    if($(window).scrollTop() + $(window).height() >= $(document).height() -300) {
        if (is_loading) {
            return;
        }
        is_loading = true;
        $('div#more').show();
        $.ajax({
            url: "more.php?last=" + $('.fap:last').attr('id'),
            success: function(html) {
                if (html) {
                    $('#photos').append(html);
                    $('div#more').hide();
                }
                else {
                    $('div#more').replaceWith('<center>No more images</center>')
                }
            }
        }).always(function() { is_loading = false; });
    }
});