无限滚动应在 10 行记录后停止。如果记录较多,应该显示ajax分页。例如,考虑这个无限滚动的例子。
因此,在 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>");
}
}
}
}
});