conversion pagination simple javascript en code jquery

Question

j'ai un simple code de pagination pagination qui avait été écrit avec les codes javascript premières

function ChangeForumPage(e){ 
    if(busy == 0) 
    { 
     switch(e) 
     { 
      case "Next": 
       page = p+1; 
       p++; 
       break; 
      case "Prev": 
       if(p>1) 
       { 
        page = p-1; 
        p--; 
       } 
       break; 
     } 
     xmlHttp=GetXmlHttpObject(); 
     if (xmlHttp==null) 
      { 
      alert ("Your browser does not support AJAX!"); 
      return; 
      } 
     var url="MTForumsBlock.php?req=LastTopics&p="+page; 
     xmlHttp.onreadystatechange=ChangeForumPageProces; 
     xmlHttp.open("GET",url,true); 
     xmlHttp.send(null); 
    } 
} 

function ChangeForumPageProces(e){ 
    if(xmlHttp.readyState==4) 
     { 
     document.getElementById("MTForumBlock").innerHTML=xmlHttp.responseText; 
     document.getElementById("MTFloader").innerHTML=''; 
     busy = 0; 
     }else{ 
     document.getElementById("MTFloader").innerHTML='<img src="images/loader.gif" />'; 
     busy = 1; 
     } 
} 

et je dois avoir la même possibilité avec jquery

mais je ne sais comment faire ça!

il ne devrait changer la page si je clique ou le bouton suivant précédent

Answer 1

Vous pouvez utiliser les plug-ins de pagination jQuery au lieu et ils travaillent hors de la boîte, vous indiquez simplement vos paramètres:

• Pagination (Demo)
• Making a jQuery pagination system (Demo)

Answer 2

Bien sûr, pas un problème. Ce qui suit utilise le multiple selector pour attacher un click event handler à vos boutons précédent et suivant. Il utilise ensuite le load method pour obtenir le code HTML que vous utiliserez pour remplir votre #MTForumBlock:

var busy = false; 
var p = 1; 
$('#next, #prev').click(function(e){ 

    // stop the link's href from being followed 
    e.preventDefault(); 

    // check if we're in the middle of a request 
    if(busy) return; 
    busy = true; 

    // Update the page variable 
    if($(this).attr('id') == 'next'){ 
     p++; 
    } else if (p > 1) { 
     p--; 
    } 

    // Add the loader image 
    var loader = $('<img src="images/loader.gif" /'); 
    $('#MTFloader').append(loader); 
    $('#MTForumBlock').load('MTForumsBlock.php?req=LastTopics&p='+p, function() { 
     // Remove the loader image once the AJAX is finished and mark finished 
     loader.remove(); 
     busy = false; 
    }); 

)}; 

Le code HTML ressemblerait à quelque chose comme ceci:

<a href="" id="next">Next</a> 
<a href="" id="prev">Previous</a>