Question

从网络上的某个地方获得了此工作代码段，但我不知道如何进行修改。问题是：无论页面上的什么位置，它每次滚动时都会执行该功能。

它应该仅在即时消息接近底部时执行。

这是“无限滚动”的代码段

<script>
$(document).ready(function() {

$(window).scroll(fetchPosts);

function fetchPosts() {

    var page = $('.endless-pagination').data('next-page');

    if(page !== null) {

        clearTimeout( $.data( this, "scrollCheck" ) );

        $.data( this, "scrollCheck", setTimeout(function() {
            var scroll_position_for_posts_load = $(window).height() + $(window).scrollTop() + 100;

            if(scroll_position_for_posts_load >= $(document).height()) {
                $.get(page, function(data){
                    $('.posts').append(data.posts);
                    $('.endless-pagination').data('next-page', data.next_page);
                });
            }
        }, 350))

    }
}

}）

我的程序员有什么想法吗？使用Laravel 5.2

Answer 1

有效的解决方案：

 window.onscroll = function() {
     if ((window.innerHeight + window.pageYOffset) >= (document.body.scrollHeight - 500)) {
         fetchPosts();
     }
 };

-500，在到达底部之前执行该功能。

JS仅在底部附近而不是在每个窗口滚动时才执行功能

1 个答案: