Official website: http://jqpaginator.keenwon.com/
Github:https://github.com/keenwon/jqpaginator
Example:
<!DOCTYPE HTML Public "-//W3C//DTD XHTML 1.0 transitional//en" "http://www.w3.org/TR/xhtml1/DTD/ Xhtml1-transitional.dtd "><HTMLxmlns= "http://www.w3.org/1999/xhtml"><Head> <Metahttp-equiv= "Content-type"content= "text/html; charset=utf-8" /> <Metaname= "Viewport"content= "Width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, User-scalable=no"><Linktype= "Text/css"rel= "stylesheet"href= "Http://cdn.staticfile.org/twitter-bootstrap/3.1.1/css/bootstrap.min.css"/> <Scripttype= "Text/javascript"src= "./content/jquery/jquery-3.2.1.min.js"></Script> <Scripttype= "Text/javascript"src= "./content/pagination/jqpaginator.js"></Script></Head><Body> <inputID= "BTN"value= "Change"type= "button"> <PID= "P1"></P> <ulclass= "pagination"ID= "Pagination1"></ul> <PID= "P2"></P> <ulclass= "pagination"ID= "Pagination2"></ul> <Script>$.jqpaginator ('#pagination1', {totalpages: -, Visiblepages:Ten, CurrentPage:3, First:'<li class= "First" ><a href= "javascript:void (0);" > Home <\/a><\/li>', prev:'<li class= "prev" ><a href= "javascript:void (0);" ><i class= "Arrow arrow2" ><\/i> prev <\/a><\/li>', Next:'<li class= "Next" ><a href= "javascript:void (0);" > Next <i class= "Arrow arrow3" ><\/i><\/a><\/li>', Last:'<li class= "Last" ><a href= "javascript:void (0);" > End <\/a><\/li>', page:'<li class= "page" ><a href= "javascript:void (0);" >{{page}}<\/a><\/li>', Onpagechange:function(num, type) {$ ('#p1'). Text (Type+ ':' +num); } }); $.jqpaginator ('#pagination2', {totalpages: -, Visiblepages:Ten, CurrentPage:3, prev:'<li class= "prev" ><a href= "javascript:;" >Previous</a></li>', Next:'<li class= "Next" ><a href= "javascript:;" >Next</a></li>', page:'<li class= "page" ><a href= "javascript:;" >{{page}}</a></li>', Onpagechange:function(num, type) {$ ('#p2'). Text (Type+ ':' +num); } }); $("#btn"). On ("Click", function () { $('#pagination1'). Jqpaginator ('option', {totalpages:Ten, CurrentPage:1 }); }); </Script> </Body></HTML>
jquery Open Source Component--jqpaginator pagination component