Use of Jquery.pagination.js

HTML page

// to display the table of contents <table id= "Gifts" >            <tr class= ' first ' >                <th> time </th>                <th> Get rewards </th>            </tr>            <tr>                <td>2018-00 :xx:</td>                <td>2000 Gold </td>            </tr></table> // Page that displays pagination is the style that you define class="liuyanpage page">  </div>   

The HTML structure that the plugin generated last

Come on, start learning to use this plugin

1, first introduced

<script type="text/javascript" src="js/jquery-1.8.3.js " ></script>  <script type="text/javascript" src="js/ Jquery.pagination.js"

2. Custom Plugins

$('. Liuyanpage'). Pagination ({PageCount:Math.ceil (counts/one_page_show_nums),//counts for the total number of data you want to display, one_page_show_nums the number of bars you want to display per page coping:true, homepage:'Home Page', EndPage:'last page', Prevcontent:'Previous Page', Nextcontent:'Next Page', Count:2});

3, the parameters of the configuration

Totaldata:0,//total number of data barsShowData:0,//number of bars to display per pagePageCount:9,//total pages, default = 9Current1,//Current PagePREVCLS:'prev',//Prev classNEXTCLS:'Next',//next Page classPrevcontent:'<',//Previous page ContentNextcontent:'>',//Next Page ContentACTIVECLS:'Active',//Current page checked status class nameCoping:false,//Whether to open the first and last page, the value is BooleanIshide:false,//pagination is not displayed when the current page is 0 or 1 pagesHomepage:"',//Home node content, default is emptyEndPage:"',//last node content, default is emptyKEEPSHOWPN:false,//whether to display the previous page next pageCount3,//number of pages before and after the current pageJumpfalse,//jump to a specified number of pagesJUMPIPTCLS:'Jump-ipt',//text Box ContentsJUMPBTNCLS:'jump-btn',//Jump ButtonJUMPBTN:'Jump',//Jump Button TextCallback:function () {}//callback function, parameter "index" is the current page

API interface

Method	Parameters	Description
Getpagecount ()	No	Get Total Pages
Setpagecount (page)	Page: Pages	Set Total pages
GetCurrent ()	No	Get current Page
Filling ()	No	Fill data, parameter is number of pages

Example usage

$ (function () {$ ('. Liuyanpage'). Pagination ({pagecount:<?# $counts? >/8, Coping:true, homepage:'Home Page', EndPage:'last page', Prevcontent:'Previous Page', Nextcontent:'Next Page', Count:2, callback:pagecallback}); /page Turn function pagecallback (index, JQ) {MYAPI (index);}
Request function MyApi (current) {$.post (url,{page:current},function (data) {if(data.code!=0){        }Else{            varhtm="';  for(varI=0; i<data.mylist.length;i++) {htm+='<tr><td>'+data.mylist[i]['Createtime']+'</td><td>'+data.mylist[i]['name']+'</td></tr>'            }            $("#tc5 #gifts tr:not (. First)"). Remove (); $("#tc5 #gifts"). append (HTM);//append the returned data to the table        }    },'JSON');}});

Use of Jquery.pagination.js