ホームページ  >  記事  >  php教程  >  Ajax ページングの良い例

Ajax ページングの良い例

WBOY
WBOYオリジナル
2016-06-21 08:50:551064ブラウズ

 

样式可以自定义,调用简单,直接看实例了,效果图如下:

 

  1.   
  2.   
  3.   
  4.   
  5. ajax分页  
  6.   
  7.   
  8.   
  9.   
  10.   
  11.   
  12.   
  13.   
  14. <スクリプト>  
  15. テストページ(1);  
  16. 関数 testPage(curPage){
  17.   
  18.         supage('pageNav','testPage','',curPage,100,5);  
  19.   
  20. }
  21.   
  22.   
  23. /**
  24. * @param {String} divName ページング ナビゲーションによってレンダリングされる dom オブジェクト ID
  25. * @param {String} funName ページ番号をクリックすると、バックグラウンド クエリ データの JS 関数を実行する必要があります
  26. * @param {Object} params バックグラウンドクエリデータ関数のパラメータの順序は、現在のページを
  27. 内に設定する必要があります。
  28. * @param {String} total バックグラウンドによって返されるレコードの総数
  29. * @param {Boolean} pageSize 各ページに表示されるレコードの数、デフォルトは 10 です
  30. ​*/
  31. function supage(divId, funName, params, curPage, total, pageSize){
  32.     var output = '
    ';  
  33.     var pageSize = parseInt(pageSize)>0 ? parseInt(pageSize) : 10;  
  34.     if(parseInt(合計) == 0 parseInt(合計) == 'NaN') return;  
  35.     var totalPage = Math.ceil(total/pageSize);  
  36.     var curPage = parseInt(curPage)>0 ? parseInt(curPage) : 1;  
  37.       
  38.     //パラメータ数对オブジェクト中解析結果各パラメータ
  39.     var param_str = '';  
  40.     if(typeof params == 'オブジェクト'){
  41.         for(o in params){
  42.             if(typeof params[o] == 'string'){
  43.                param_str += ''' + params[o] + '',';  
  44.             }
  45.             それ以外{
  46.                param_str += params[o] + ',';  
  47.             }
  48.         }
  49.         //アラート(111);  
  50.     }
  51.     //設置開始页码
  52.     if (totalPage > 10) {
  53.         if ((curPage - 5) > 0 && curPage < totalPage - 5) {
  54.             var start = curPage - 5;  
  55.             var end = curPage + 5;  
  56.         }
  57.         else if (curPage >= (totalPage - 5)) {
  58.             var start = totalPage - 10;  
  59.             var end = totalPage;  
  60.         }
  61. それ以外 {
  62. var start = 1;
  63. var end = 10;
  64. }
  65. }
  66. 他 {
  67. var start = 1;
  68. var end = totalPage;
  69. }
  70. //ホームページコントロール
  71. If(curPage>1){
  72. 出力 += '«'; 🎜>
  73. }
  74. その他
  75. {
  76. 出力 += '« ';
  77. }
  78. //前ページメニューコントロール
  79. If(curPage>1){
  80. Output += '‹<
  81. }
  82. else{
  83. 出力 += '';
  84. }
  85. //ページ番号表示
  86. for (i = 開始; i If (i == curPage) {
  87. 出力 += '
    ';
  88.                                                                                                
  89. それ以外 {
  90. 出力 += '' + i + '';
  91.                                                                                                
  92. }
  93. //次のページのメニュー コントロール
  94. If(totalPage>1 &&curPage
  95. Output += '›<
  96. }
  97. 他{
  98. 出力 += ''
  99. }
  100. //最後のページコントロール
  101. If(curPage
  102. 出力 += '»'; 🎜>
  103. }
  104. 他{
  105. 出力 += '»'
  106. }
  107. 出力 += '
';
  • // dom にレンダリング
  • Document.getElementById(divId).innerHTML = 出力;
  • };


  • 声明:
    この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
    前の記事:WordPress データベースの冗長性?クイック最適化プラグイン WP Clean Up次の記事:WordPress データベースの冗長性?クイック最適化プラグイン WP Clean Up

    関連記事

    続きを見る