Introducción
Compatible con IE6+ y navegadores modernos, admite varias páginas en la misma página.
usar
Navegador
<link rel = "stylesheet" href = "css/gb-paging.css"> <script src = "js/gb-paging.js"> </script>
Paginación normal
Html
<div id = "gbpaging">
Js
GBPaging ({Total: 101, ParamName: 'P', curpage: getPage ('P', '#'), size: 5, Prevtext: '<', nextText: '>', pageInfo: '<b> {{currentPage}}} </b>/<b> {{{Totalpage}}}} </b>', EventType: '};Otra página para la misma página
Html
<div id = "Paging1"> </div>
Js
GBPaging ({eleid: 'Paging1', Total: 54, tamaño: 10, PrevExt: False, NextText: False, ParamName: 'P1', curpage: getPage ('p1', '#'), pageInfo: false, eventtype: 'hacer clic'});Actualizar con los parámetros
Html
<div id = "Paging2"> </div>
Js
gbpaging ({eleid: 'Paging2', Total: 2500, ParamName: 'Page', curpage: getPage ('Page', '? Type = 1 & name = 2 &'), gourl: '? type = 1 & name = 2 & {{n}}'});Funciones auxiliares
function getPage (pname, otro) {var page = window.location.search.replace (otro + pname + '=', '') || 1; return parseint (página);}Opción
ELEID PAGING CONTAYER, solo admite ID, predeterminado es: 'GBPaging'
Total: Total Records
ParamName: Nombre del parámetro de paginación || 'pag'
Cortecimiento: número de página actual
Tamaño: Número de registros por página || 10
PrevExt: Copia de página anterior || 'Página anterior', el valor es falso y no se muestra
NextText: 'Copia de la página siguiente || El valor de la 'página siguiente' es falso no se muestra
PageInfo: información de paginación, {{CurrentPage}} Número de página actual, {{TotalPages}} Número de página total || Actual {{currentPage}} página/total {{TotalPages}}, el valor es falso no se muestra
EventType: Modo de evento, 'Haga clic' || 'enlace'
gourl: link url, '? type = 1 & name = 2 & {{n}}' || '', {{n}} es el nombre del parámetro de la página + valor, como: 'p = 1'
Github
https://github.com/givebest/gb-paging
Código completo
/** * gb-paging.js * @class gbpaging * @see https://github.com/giveBest/gb-paging * @author [email protected] * @(c) 2016 **/(function () {var $, defaultcig, paging = null, args;/** * [defaultonfig configuración] * @Type {Object {Object {Object {Object {Object {Object {Object {Object {Object * * = {eventType: 'link', curpage: 1, // size actual de página: 10, // n paramname por página: 'p', // Page Number Parameter Prevtext: 'Page anterior', NextText: 'Página siguiente', página Pageinfo: 'Current <b> {{actual Page}}} </b> páginas/total <b> [$ Descripción] * @param {String} id * @return {object} html [html elemento] */ $ = function (id) {return document.getElementById (id) this.getParams (opta); ($ ('gbpaging') {args.container = $ ('gbpaging'); defaultCig.size; defaultcig.prevText; * [Pagination html] * @return {[type]} [descripción] */ gbpaging.prototype.build = function () {var html = [] >>> 0 <= 0) return; para (var i = 1; i <ii; i ++) {if (args.curpage - i> 1) {html.unshift ('<a href = "' + urlparam + (args.curpage - i) + '">' + (args.curpage - i) + '</a>'); html.push ('<a href = "' + urlparam + (args.curpage + i) + '">' + (args.curpage + i) + '<a>' ') html.unshift ('<a href = "' + urlparam + '1"> 1 </a>'); html.unshift ('<a>' + args.prevText + '</a>'); + '">' + args.pages + '</a>'); args.isnext && html.push ('<a href =" + urlparam + (args.curpage + 1) +' "> ' + args.nexttext +' </a> ');} else {args.isnext && html.push (' <<a> '' + argsxt + + argsx '</a>'); args.container.innerhtml = html.join (''); E || Window.Event; 'discapacitado')) {args.curpage = target.getAttribute ('href'). reemplazar (parseurl (args.gourl, args.paramname), '') parseint (args.curpage); url.replace ('{{n}}', param + '='); (typeOf addEventListener === 'function') {ele.addeventListener (evento, fn, falso); {Function} Fn Callback Función* / /* Función Unbind (ELE, Event, Fn) {if (typeOf RemoVeVentListener === 'function') {ele.removeEventListener (event, fn, false) {Objeto} ele html objeto * @param {string} cls classname * @return {boolean} */ function Hasclass (ele, cls) {if (! Ele || Regexp ('(// s |^)' + cls + '(// s | $)')); ele.classlist.add (cls); if (ele.classList) {ele.classlist.remove (cls); (Window.gbpaging == Undefined) {Window.gbpaging = function (opts) {paging = gbpaging (); Define.amd) {Define ('gb-paging', [], function () {return gbpaging;});