Generate the pagination button at the bottom of the Ajax search result page

The JQ plug-in has been made in time, which may be less universal, but has some basic functions. It is suitable for beginners.
Oh, let's just say that the button in JQueryUI is pretty good.
Is the first page

This is the last page.

If you don't need to talk about it, please leave a message with parameters on the code. Copy codeThe Code is as follows ://------------------------------------------------------
// Display pageingBtn () pagination button
// PageIndex: Current page
// MaxPage: Total number of pages of a paging Dataset
// BtnSize: Maximum number of buttons displayed
// PageSize: page number
// KeyWord: keyWord
// Container: filled container
//------------------------------------------------------
Function pageingBtn (pageIndex, maxPage, btnSize, pageSize, keyWord, container ){
Var BtnList = '';
((Container).html ('');
If (pageIndex! = 1 ){
BtnList + = '<button value = "1" class = "firstPage"> page 1 </button> ';
Var prevPageIndex = (pageIndex-1) <1? 1: (pageIndex-1 ));
BtnList + = '<button value = "' + prevPageIndex + '" class = "prevPage"> Previous Page' + prevPageIndex + 'page </button> ';
}
// Set the style displayed on the current page.
Var pageIndexStyle = 'class = "pageIndex" '; // you can specify the start value of a button.
Var start = (pageIndex-(btnSize/2 | 0)> 0 )? (PageIndex-(btnSize/2 | 0): 1;
// If the start value of the button + the maximum number of displayed buttons and the number of pages greater than the maximum number of pages, set the start value of the button to the maximum number of pages minus the start value plus one.
If (start + btnSize)> maxPage ){
Start = maxPage-btnSize + 1
} // The processing result here is that if the maximum number of buttons displayed is 15,-7,-6,-5 will appear when the maximum number of data pages is less than 15, -4... 0, 1, 2, 3, 4, and so on
Start = (start <= 0? 1: start );
For (var I = start; I <start + btnSize; I ++ ){
If (I> maxPage ){
Break;
}
If (I = pageIndex ){
BtnList + = '<button value = "' + I + '"' + pageIndexStyle + '>' + I + '</button> ';
}
Else {
BtnList + = '<button value = "' + I + '">' + I + '</button> ';
}
}
If (pageIndex <maxPage ){
Var nextPageIndex = (pageIndex + 1)> maxPage? MaxPage: (pageIndex + 1 ));
BtnList + = '<button value = "' + nextPageIndex + '" class = "nextPage"> next page' + nextPageIndex + 'page </button> ';
BtnList + = '<button value = "' + maxPage + '" class = "endPage"> last page' + maxPage + '</button> ';
}
$ (Container). append (BtnList );
// Button events generated after binding
$ (Container). find ("button"). button (). click (function (){
Loadingimg ();
$. Post ("/author/query /",
{
'Pageindex': $ (this). val (),
'Pagesize': pageSize,
'Order': 'desc ',
'Sort ':'',
'Keyword': keyWord // $ ("# SearchText"). val ()
},
Function (data ){
$ ("# SearchText"). val (keyWord );
LoadBookList (data );
}
);
}
); // Modify the button style here
$ (". NextPage"). button ({icons :{
Secondary: "ui-icon-seek-next"
}, Text: false
});
$ (". PrevPage"). button ({icons :{
Primary: "ui-icon-seek-prev"
}, Text: false
});
$ (". EndPage"). button ({icons :{
Secondary: "ui-icon-seek-end"
}, Text: false
});
$ (". FirstPage"). button ({icons :{
Primary: "ui-icon-seek-start"
}, Text: false
});
$ (". PageIndex" ).css ({'background ':' # ff0000 ', 'color':' # ffff '});
}