跟踪滚动事件上的页码

Keeping track of page number on scroll event

本文关键字：滚动 事件 跟踪      更新时间：2023-09-26

我有一个网页，它将在加载时加载第一页的内容。一旦用户滚动页面，我就会使用 ajax 调用加载剩余页面的内容。这里出错的是我有一个变量，该变量将被初始化为 2（因为第一页是在加载页面时加载的）以跟踪页码。我的想法是，一旦用户滚动，我会增加这个变量，以便它指向下一页。但它不起作用。在 ajax 调用结束之前，它会递增。所以它错过了很多页面。谁能告诉我更好的方法？这是代码..

var pageNo = 2;
$(window).scroll(function() { if($(window).scrollTop() == $(document).height() -$(window).height()) {
    console.log('pageNo ' + pageNo);
    $.ajax({
        type: 'POST',
        cache: false,
        dataType: 'json',
        url: 'url'+pageNo,
        success: function(data, status, xhr) {
        $.each(data,function(i, item) {
           var tp = $('content');
           $('#trpcontainer').append(tp);
        });
    },
    error: function(jqXHR, textStatus, errorThrown) {
    }
});
}
  pageNo = pageNo + 1;
});

试试这个例

需要一些修改，因为还要计算向上滚动

.HTML 

  <div>Try scrolling the iframe.</div>
  <p>Paragraph - <span>Scroll happened!</span></p>

.JS

  $( "p" ).clone().appendTo( document.body );
  $( "p" ).clone().appendTo( document.body );
  $( "p" ).clone().appendTo( document.body );
  $( "p" ).clone().appendTo( document.body );
  $( "p" ).clone().appendTo( document.body );
  var pag=0; 
  $( window ).scroll(function() {
  pag+=1;
  $( "span" ).css( "display", "inline").append(pag); 
  });
相关文章：