跟踪页码上滚动事件页码、事件

2023-09-10 22:08:01 作者:高冷不是我的范er

我有将装入一页上负载的内容的网页。一旦用户滚动页面我加载使用AJAX调用剩余页面的内容。出了什么错在这里的是,我有这将被初始化为2变量来跟踪的页面数量(因为一个页面上加载页面加载)。我想我是会增加此变量一旦用户滚动,这样它会指向下一个页面。但它不能正常工作。它得到增加Ajax调用结束之前。所以它错过了很多页。谁能告诉我更好的方式来做到这一点?这里是code ..

  VAR页次= 2;

$(窗口).scroll(函数(){如果($(窗口).scrollTop()==(文档​​)$ .height() -  $(窗口).height()){

    的console.log('页次'+页次);
    $阿贾克斯({
        键入:POST,
        缓存:假的,
        数据类型:JSON,
        URL:URL+页次,
        成功:功能(数据,状态,XHR){
        $每个(数据,功能(I,项目){
           变种TP = $(内容);
           $('#trpcontainer)追加(TP)。
        });
    },
    错误:函数(jqXHR,textStatus,errorThrown){

    }
});
}
  页次=页次+ 1;
});
 

解决方案

试一试之一 例

需要一些修改,因为也算向上滚动

HTML

 < D​​IV>尝试滚动的iframe< / DIV>
  &其中p为H.;第 - &其中;跨度>滚动最少&所述; /跨度>&所述; / 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;
  $(窗口).scroll(函数(){
  PAG + = 1;
  $(跨越)的CSS(显示,内联)追加(PAG);
  });
 
word2003中如何在首页同时显示页脚和页码

I have a web page which will be loaded with the contents of page one on load. Once the user scrolls the page I'm loading the contents of remaining pages using ajax call. What went wrong here is that I'm having a variable which will be initialized to 2 ( since page one is loaded on loading the page ) to keep track of the page number. What I thought is I would increment this variable once the user scrolls so that it would be pointing to the next page. But Its doesn't work. Its getting incremented before the ajax call is over. So Its missing out many pages. Can anyone tell me the better way to do this ? here is the code..

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;
}); 

解决方案

Try This one in Example

Require Some Modification because also count UP Scrolling

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); 
  });

 
精彩推荐
图片推荐