JS paging program details

/*************************************** ************/
Var pageFunc = function (){
// Alert ('where ');
Var _ this = this;
This. render = function (arr) {// simulation class abstract function
Throw new Error ('the function cannot be null ');
}
This. renderButton = function () {// simulation class abstract function
Throw new Error ('the function cannot be null ');
}
This. bindEvent = function () {// simulation class abstract function
Throw new Error ('the function cannot be null ');
}
This. init = function (){
Throw new Error ('the function cannot be null ');
}
This. getChangePage = function (){
Throw new Error ('the function cannot be null ');
}
This. getPages = function (){
Return 0;
}
This. pages = _ this. getPages ();
This. currentPage = 1;
This. pageSize = 3;
This. getNextPage = function (){
Var _ nextPage = _ this. currentPage + 1;
If (_ nextPage> = _ this. pages ){
_ NextPage = _ this. pages;
}
Return _ nextPage;
}
This. getPreviousPage = function (){
Var _ previousPage = 1;
_ PreviousPage = _ this. currentPage-1;
If (_ previousPage <= 0 ){
_ PreviousPage = 1;
}
Return _ previousPage;
}
This. gotoPage = function (pageNum ){
If (pageNum! = _ This. currentPage ){
Var _ arr = '';
_ Arr = [];
_ Arr ['start'] = pageNum-1;
_ Arr ['len'] = _ this. pageSize;
_ This. render (_ arr );
_ This. currentPage = pageNum;
_ This. getChangePage ();
// Alert (pageNum );
}
}
This. gotoFirstPage = function (){
// Alert ('gotofirstpage ');
// Alert (_ arr ['start']);
_ This. gotoPage (1 );
}
This. gotoLastPage = function (){
_ This. gotoPage (_ this. pages );
}
This. gotoNextPage = function (){
Var _ nextPage = _ this. currentPage + 1;
If (_ nextPage> _ this. pages ){
_ NextPage = _ this. pages;
}
_ This. gotoPage (_ nextPage );
}
This. gotoPreviousPage = function (){
Var _ previousPage = _ this. currentPage-1;
If (_ previousPage <1 ){
_ PreviousPage = 1
}
_ This. gotoPage (_ previousPage );
}
This. run = function (){
_ This. pages = _ this. getPages ();
_ This. currentPage = 1;
_ This. renderButton ();
_ This. render ({start: 1, len: _ this. pageSize });
}
}

/*************************************** ************/
// Alert((('div?calss=pages='{.html ());
Var page = new pageFunc ();
Page. pageSize = 3;
Page. init = function (){
Vertex ('.pages').children().css ('cursor ', 'pointer ');
}
Page. render = function (arr) {// arr ['start'], arr ['len']
$ ('. ItemDl'). children (). slideUp (100 );
// Console. log (arr ['len']);
$ ('. ItemDl '). children (). slice (arr ['start'], arr ['start'] + arr ['len']). slideDown (1000 );
// Console. log ($ ('. itemDl '). siblings (). slice (arr ['start'], arr ['start'] + arr ['len']). length );
// Alert ($ ('. itemDl'). find ('dd'). length );
}
Page. bindEvent = function (){
Var _ this = this;
_ This. init ();
$ ('. Pages li [rel = firstPage]'). live ('click', function (e ){
// Alert ('firstpage ');
_ This. gotoFirstPage ();
});
$ ('. Pages li [rel = lastPage]'). live ('click', function (e ){
_ This. gotoLastPage ();
});
$ ('. Pages li [rel = previousPage]'). live ('click', function (e ){
_ This. gotoPreviousPage ();
});
$ ('. Pages li [rel = nextPage]'). live ('click', function (e ){
_ This. gotoNextPage ();
});
$ ('. Pages'). find ('lil'). each (function (index ){
Var _ that = $ (this );
Var _ rel = _ that. attr ('rel ');
If (_ rel! = 'Firstpage' & _ rel! = 'Previouspage' & _ rel! = 'Nextpage' & _ rel! = 'Lastpage' & _ rel! = 'Total' & _ rel! = 'Gopage '){
_ That. live ('click', function (e ){
_ This. gotoPage (_ rel );
});
}
});
$ ('. Pages select'). live ('change', function (e ){
// Alert (e. type );
Var _ pageNum = $ (this). val ();
_ This. gotoPage (_ pageNum );
});
}
Page. renderButton = function (){
('.Pages'{.html ('');
Var _ totalPages = this. pages;
Var _ nowPage = this. currentPage;
Var _ listButton = '';
Var _ listSelect = '';
For (var I = 0; I <_ totalPages; I ++ ){
_ ListButton + = '<li rel = "' + (I + 1) + '">' + (I + 1) + '</li> ';
_ ListSelect + = '<option>' + (I + 1) + '</option> ';
}
Var _ content = '<form> <ul class = "pagelist"> <li rel = "firstPage" class = "firstpage"> homepage </li> <li rel = "previousPage "> previous page </li> '+ _ listButton +' <li rel =" nextPage "> next page> </li> <li rel =" lastPage "> last page </li> <li rel = "total"> total '+ _ totalPages +' page/'+ _ nowPage +' page </li> <li rel = "gotoPage" class = "pagelast "> jump to the <select class =" pagesxz "name =" gotoPage "> '+ _ listSelect +' </select> page </li> </ul> </form>';
('.Pages'{.html (_ content );
// Alert (_ content );
// Document. write (_ content );
This. bindEvent ();
}
Page. getPages = function (){
Var _ len = parseInt ($ ('. itemDl'). children ('dd'). length );
// Alert (_ len );
Var _ pages = '';
// Alert (this. pageSize );
If (_ len % this. pageSize = 0 ){

_ Pages = _ len/this. pageSize
} Else {
// Alert (_ len/this. pageSize );
_ Pages = parseInt (_ len/this. pageSize) + 1;
// Alert (parseInt (_ len/this. pageSize) + 1 );
}
Return _ pages;
}
Page. getChangePage = function (){
$ ('. Pages livenrelw.totalw.'hangzhou.html ('col' + this. pages +' page/'+ this. currentPage + 'page ');
$ ('. Pages li [rel =' + this. currentPage + ']'). addClass ('thispage'). siblings (). removeClass ('thispage ');
}
Page. run ();
// Alert (run. pages );
// Run. gotoNextPage ();
/*************************************** *******************/



From the PainsOnline Column