0

私が間違っていることはわかりません。しかし、スクロール時にさらに画像をロードするために使用するコードは正しく機能しません。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>

これを修正する方法を知っている人はいますか?

4

1 に答える 1

3

おそらく、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; });
    }
});
于 2012-08-18T16:37:04.207 に答える