unendlich AJAX Scroll Paginierung Schleifen

Question

Ich benutze unendlich AJAX Scroll. Es funktioniert wie in ich kann klicken Sie auf mehr Elemente laden, und das lädt den Inhalt. Allerdings sollten ias auf der letzten Seite stoppen und zeigen ‚Es sind keine weiteren Beiträge‘, sondern es zeigt immer noch die ‚Last mehr Elemente‘ Link, wenn darauf geklickt wird wieder die Paginierung beginnt ab Seite 2.

Konsole:

Welcome at page 2, the original url of this page would be: /website/home/2 
Welcome at page 3, the original url of this page would be: /website/home/3 

ias sollte 'es sind keine weiteren Beiträge' angezeigt werden - stattdessen geht es wie folgt:

Welcome at page 4, the original url of this page would be: /website/home/2 
Welcome at page 5, the original url of this page would be: /website/home/3 

ias:

<script type="text/javascript"> 
var ias = $.ias({ 
    container: "#posts", 
    item: ".post", 
    pagination: "#pagination", 
    next: ".next a" 
}); 

ias.extension(new IASSpinnerExtension()); 
ias.extension(new IASTriggerExtension({offset: 1})); 
ias.extension(new IASNoneLeftExtension({text: 'There are no more posts.'})); 
jQuery.ias().extension(new IASPagingExtension()); 
jQuery.ias().on('pageChange', function(pageNum, scrollOffset, url) { 

console.log(
    "Welcome at page " + pageNum + ", " + 
    "the original url of this page would be: " + url  
); 

});  
</script> 

Ich habe versucht, die unten zu implementieren, funktioniert es nicht:

if(url == '/website/home/2' && pageNum > 2) { 
jQuery.ias().destroy(); 
} 

ich Paginierung bin mit von http://www.phpeasystep.com/phptu/29.html

Paginierung:

$targetpage = "home.php"; 
$limit = 10;        
$page = $_GET['page']; 
if($page) 
    $start = ($page - 1) * $limit;  
else 
    $start = 0; 



$query2 = $pdo->prepare("select count(*) from table where..."); 
$query2->execute(array(':id' => $id)); 
$total_pages = $query2->fetchColumn(); 



if ($page == 0) $page = 1;     
$prev = $page - 1;       
$next = $page + 1;       
$lastpage = ceil($total_pages/$limit);  
$lpm1 = $lastpage - 1;      


$pagination = ""; 
if($lastpage > 1) 
{ 
    $pagination .= "<ul class=\"pagination\">"; 

    if ($page > 1) 
     $pagination.= " <li class=\"next\"><a href=\"$targetpage?page=$prev\">&laquo;</a></li>"; 
    else 
     $pagination.= "<li class=\"disabled\"><a href=\"#\">&laquo;</a></li>"; 


    if ($lastpage < 7 + ($adjacents * 2)) 
    { 
     for ($counter = 1; $counter <= $lastpage; $counter++) 
     { 
      if ($counter == $page) 
       $pagination.= "<li class=\"active\"><a href=\"#\">$counter<span class=\"sr-only\">(current)</span></a></li>"; 
      else 
       $pagination.= " <li class=\"next\"><a href=\"$targetpage?page=$counter\">$counter</a></li>";      
     } 
    } 
    elseif($lastpage > 5 + ($adjacents * 2))  
    { 

     if($page < 1 + ($adjacents * 2))   
     { 
      for ($counter = 1; $counter < 4 + ($adjacents * 2); $counter++) 
      { 
       if ($counter == $page) 
        $pagination.= "<li class=\"active\"><a href=\"#\">$counter<span class=\"sr-only\">(current)</span></a></li>"; 
       else 
        $pagination.= " <li class=\"next\"><a href=\"$targetpage?page=$counter\">$counter</a></li>";      
      } 
      $pagination.= ""; 
      $pagination.= " <li class=\"next\"><a href=\"$targetpage?page=$lpm1\">$lpm1</a></li>"; 
      $pagination.= " <li class=\"next\"><a href=\"$targetpage?page=$lastpage\">$lastpage</a></li>";  
     } 

     elseif($lastpage - ($adjacents * 2) > $page && $page > ($adjacents * 2)) 
     { 
      $pagination.= " <li class=\"next\"><a href=\"$targetpage?page=1\">1</a></li>"; 
      $pagination.= " <li class=\"next\"><a href=\"$targetpage?page=2\">2</a></li>"; 
      $pagination.= ""; 
      for ($counter = $page - $adjacents; $counter <= $page + $adjacents; $counter++) 
      { 
       if ($counter == $page) 
        $pagination.= "<li class=\"active\"><a href=\"#\">$counter<span class=\"sr-only\">(current)</span></a></li>"; 
       else 
        $pagination.= " <li class=\"next\"><a href=\"$targetpage?page=$counter\">$counter</a></li>";      
      } 
      $pagination.= ""; 
      $pagination.= " <li class=\"next\"><a href=\"$targetpage?page=$lpm1\">$lpm1</a></li>"; 
      $pagination.= " <li class=\"next\"><a href=\"$targetpage?page=$lastpage\">$lastpage</a></li>";  
     } 

     else 
     { 
      $pagination.= " <li class=\"next\"><a href=\"$targetpage?page=1\">1</a></li>"; 
      $pagination.= " <li class=\"next\"><a href=\"$targetpage?page=2\">2</a></li>"; 
      $pagination.= ""; 
      for ($counter = $lastpage - (2 + ($adjacents * 2)); $counter <= $lastpage; $counter++) 
      { 
       if ($counter == $page) 
        $pagination.= "<li class=\"active\"><a href=\"#\">$counter<span class=\"sr-only\">(current)</span></a></li>"; 
       else 
        $pagination.= " <li class=\"next\"><a href=\"$targetpage?page=$counter\">$counter</a></li>";      
      } 
     } 
    } 


    if ($page < $counter - 1) 
     $pagination.= " <li class=\"next\"><a href=\"$targetpage?page=$next\">&raquo;</a></li>"; 
    else 
     $pagination.= "<li class=\"disabled\"><a href=\"#\">&raquo;</a></li>"; 
    $pagination.= "</ul>\n";   
} 

Answer 1

Bitte versuchen Sie es für unendliche eine weitere Event-Handler hinzugefügt Ajax Scroll wie folgt:

jQuery.ias.on('noneLeft', function() { 
    console.log('We hit the bottom!'); 
}); 

Und sehen Sie, ob dies in der Browser-Konsole gedruckt wird oder nicht. Wenn dies nicht gedruckt wird, haben Sie ein Problem mit Ihren Paginierungslinks. Überprüfe das. Überprüfen Sie Ihren HTML-Code mit Firebug und prüfen Sie, ob gültige Links generiert werden oder nicht.

Wenn Ihr Paginierung ist richtig, und wenn Sie oben noneLeft Ereignis sehen dann folgenden Code versuchen Sie es mit Scrollen zu stoppen:

pageNum = 0; 
jQuery.ias.on('next', function(url) { 
    if (url.indexOf("/website/home/2") > -1 && pageNum > 2) { 
     return false; 
    } 
    else{ 
     pageNum++; 
    } 
}) 

Answer 2

ich eine kundenspezifische Lösung mit reinem jquery haben, hier, wie es funktioniert,

/** Javascript Block **/ 
//make a request(load_next_set_records) to records that go for content loading by scroll or click of button 
$(".load_more_button").on('click',load_next_set_records); 
function scrollDetectLimit(){//trigger load_next_set_records(); when scroll reaches a target} 

load_next_set_records = function(){ 
    $.ajax({ 
     url : '/url_that_returns_json_records', 
     data:{ 
      //required to return next paginated records assumed that records are wrapped within div.record_block that resembles loaded records 
      next_records_load_pointer:$(".record_block").length 
     }, 
     dataType : 'json', 
     beforeSend:function(){}, 
     success:function(response){ 
     if(//response has many records) 
      //actions when records exists, append new set of records wrapped with div.record_block 
     else 
     //simply disable loadmore button see below in error call back 

     }, 
     error:function(xhr){ 
     //simply disable loadmore button 
     $(".load_more_button").before('No more to load'); 
     $(".load_more_button").fadeOut(); 
     } 
    }); 
    } 

Ich hoffe, Sie bekommen die Code-Logik, diese brauchen weitere Code-Update nach Ihrer Anforderung, lassen Sie mich wissen, wenn es Schwierigkeiten gibt, hinein zu kommen.