源码:
; (function ($) {
var paginator = function () {
var self = this,
element = null,
settings = {
total: 0,
pageIndex: 0, //
pageSize: 20,
// event;
pageChanged: false
};
this.fnInit = function (ele, opts) {
/// <summary>init</summary>
element = ele;
$.extend(settings, opts);
$(element).addClass('pagination').bind('click', function (e) {
if (e.target.tagName === 'A') {
if ($(e.target).parent().is('.disabled,.active')) return false;
var ref = $(e.target).attr('href').split('#')[1];
if (ref === 'next') {
settings.pageIndex++;
} else if (ref === 'pref') {
settings.pageIndex--;
} else {
settings.pageIndex = window.parseInt(ref) || 0;
}
// rebuild
self.fnBuild();
// trigger
if (settings.pageChanged) {
settings.pageChanged.apply(self, [settings.pageIndex]);
}
return false;
}
});
// build paginator
self.fnBuild();
return self;
}
this.fnUpdateSettings = function (opts) {
$.extend(settings, opts);
return this.fnBuild();
}
this.fnBuild = function () {
/// <summary>fnCall</summary>
var cnt = window.Math.ceil(settings.total / settings.pageSize) || 1;
var html = [];
html.push('<li ', settings.pageIndex === 0 ? 'class="disabled"' : '',
'><a href="#prev">«</a></li>'); // prev page;
for (var i = 0; i < cnt; i++) {
html.push(
'<li',
settings.pageIndex === i ? ' class="active"' : ''
, '><a href="#', i, '">', i + 1, '</a></li>');
}
html.push('<li ', settings.pageIndex + 1 === cnt ? 'class="disabled"' : '',
'><a href="#next">»</a></li>'); // next page;
$(element).html(html.join(''));
return self;
}
}
$.fn.extend({
paginator: function (opts) {
var ins = new paginator();
return ins.fnInit(this, opts);
}
});
$('#pager2').paginator({
total: 0,
pageIndex: 0,
pageChanged: function () {
console.log(arguments);
},
pageSize: 10
});
})(jQuery);
使用:
$('#pager2').paginator({
total: 0,
pageIndex: 0,
pageChanged: function () {
console.log(arguments);
},
pageSize: 10
});