Question

无限滚动应在10行记录后停止。如果有更多记录，则应显示ajax分页。例如，考虑this infinite scrolling example 因此，在20个记录之后我想要显示分页，并且应该在下一页上完成相同的操作。如果您有任何想法或解决方案，请告诉我。

以下是我正在处理的代码：

    //On doMouseWheel = 1 I have taken the currentdealoffset value and check it with the total no of deals present
    //If count is less, then simply calculating the window position displaying the allotted records say 10
    //On next scroll just doing the same process and fetching records using ajax until end of the deals
    //Now the problem is I am not able to code a logic where after say 10 records show a pagination and 
    //When click on next page the same process should be managed by fetching the offset count of scrol and offset of pagination bar

    doMouseWheel = 1 ;   

            $(window).scroll(function() { 
            if($('#facebox_overlay').is(':visible')==false){                
            $('#endofdeals').show();
            $('#endofdeals').html("<center><img src='"+SITEIMG +"ajax-loader_1.gif' ><center>");
            //console.log("Window Scroll ----");
            var currentdealoffset = 0; //alert(currentdealoffset);
            var currentdealoffset = parseInt(document.getElementById("countval").value); //alert(currentdealoffset);
            var displaymode = parseInt($('#displaymode').val()); 
            var totalcountdeal = parseInt($('#totaldeals').val()); //alert(totalcountdeal);
            if(currentdealoffset<totalcountdeal){
            if (!doMouseWheel)  {
            return ;
            } ;

            var distanceTop = $('#last').offset().top - $(window).height();        
                    if  ($(window).scrollTop() > distanceTop){
            //console.log("Window distanceTop to scrollTop Start");
            doMouseWheel = 0 ; 
                    $('div#loadMoreComments').show(5000);
                    //console.log("Another window to the end !!!! "+$(".postedComment:last").attr('id'));        

                    $.ajax({
                    type : 'POST',
                    dataType : "html",
                    data: {
                    typeday : $('#remdumtype').val(),                        
                    catid : $('#catid').val(),                        
                    },
                    url: "<?php echo https_url($this->config->item('base_url'))?>popup/dealsearch",
                    success: function(html) {
                    doMouseWheel = 1; 
                    if(html){
                    if(displaymode==12)
                    $('#listTable tr:last').after(html);
                    else
                    $("#postedComments").append(html);
                    //console.log("Append html--------- " +$(".postedComment:first").attr('id'));
                    //console.log("Append html--------- " +$(".postedComment:last").attr('id'));
                    $("#last").remove();
                    $("#postedComments").append( "<p id='last'></p>" );
                    $('div#loadMoreComments').hide();
                    $('#endofdeals').hide();
                    }
                    }
                    });
                    }
            }
            else
                    {
                            if($('#endofdeals')!='')
                            {
                            $('#endofdeals').hide(); 
                            if(currentdealoffset < displaymode)
                                    {
                                            $('#endofdeals').hide();
                                    }else if(currentdealoffset > displaymode)
                                    {
                                            $('#endofdeals').show();
                                            $('#endofdeals').html("<center><h2 style='color:#4C335B'>End of deals !!!!!!!</h2></center>");
                                    }
                            }
                    }
                    }
                    });

Answer 1

根据我的说法，您需要页码，但滚动时页面应该加载缓慢。如果你想要这样，你不应该使用无限滚动技术，但是LazyScroll会帮助你，如果你想要20条记录然后查询20条记录，也可以在下面创建pagination

在这里，您可以拥有Plug-in和Demo。

带有ajax分页的无限滚动（经过一些滚动显示分页）

1 个答案: