Exemple de pagination frontale jQuery Sharing_jquery

Lorsque les gens effectuent une pagination, la plupart d'entre eux renvoient une chaîne HTML pour la barre de navigation en arrière-plan. En fait, c'est également facile à implémenter en utilisant js sur le front-end.

Appelez la méthode pager, entrez les paramètres et une chaîne HTML de la barre de navigation sera renvoyée. Les éléments internes de la méthode sont relativement simples.

Copier le code Le code est le suivant :

/**
* pageSize, nombre affiché par page
* pageIndex, numéro de page actuel
* pageCount Nombre total de pages
*url adresse de connexion
* Exemple d'utilisation de pager(10, 1, 5, 'Index')
*/
fonction pager (pageSize, pageIndex, pageCount, url) {
var intPage = 7; //Affichage du numéro
var intBeginPage = 0;//Nombre de pages de démarrage
var intEndPage = 0;//Numéro de page de fin
var intCrossPage = parseInt(intPage / 2); //Numéro affiché
var strPage = "

page" pageIndex "/" pageCount " Page par page< ;font color='#FF0000'>" pageSize " bandes";
Si (pageIndex > 1) {
           strPage = strPage "Page d'accueil ";
strPage = strPage "Page précédente< /a> ;";
>
If (pageCount > intPage) {//Le nombre total de pages est supérieur au nombre de pages affichées sur la page
If (pageIndex > pageCount - intCrossPage) {//Numéro de la page actuelle >Nombre total de pages-3
               intBeginPage = pageCount - intPage 1;
               intEndPage = pageCount;
>
         autre {
Si (pageIndex <= intPage - intCrossPage) {
                  intBeginPage = 1;
                 intEndPage = intPage;
            }
             autre {
                  intBeginPage = pageIndex - intCrossPage;
intEndPage = pageIndex intCrossPage;
            }
>
} autre {
intBeginPage = 1;
          intEndPage = pageCount;
>
Si (pageCount > 0) {
pour (var i = intBeginPage; i <= intEndPage; i ) {
                {
Si (i == pageIndex) {//Page actuelle
                      strPage = strPage " " i " ";
                }
                   autre {
strPage = strPage " " i " 🎜>                 }
            }
>
>
Si (pageIndex < pageCount) {
strPage = strPage "Page suivante ";
        strPage = strPage "尾页 ";
    >
    return strPage "

";
>

Essayez cette méthode

复制代码

http://www.w3.org/1999/xhtml">

   
   
   
   
   


   

       
           
               
               
               
               
               
               
               
               
               
               
               
           
       
       
   

IDClient	CompanyName	ContactName	ContactTitle	Adresse	Ville	Région	PostalCode	Pays	Téléphone	Fax

   

[/code]

看下效果

列有点多，我只截图了部分，界面好丑，加点样式，用bootstrap来美化下

使用Nuget安装bootstrap

加上样式后

虽说不是特别漂亮，但还是对得起观众吧。

代码下载https://github.com/dengjianjun/JsPager

如果觉得对你有帮助，请点个赞，谢谢！