JS 部分 根据请求参数获取对应的值 * @param item * @returns {*} */function getQueryString(item) { var sValue = location.search.match(new RegExp("[\?\]" + item + "=([^\]*)(\?)", "i")); return sValue ? sValue[1] : sValue;}function
根据请求参数获取对应的值
* @param item
* @returns {*}
*/
function getQueryString(item) {
var sValue = location.search.match(new RegExp("[\?\&]" + item + "=([^\&]*)(\&?)", "i"));
return sValue ? sValue[1] : sValue;
}
function page(option) {
var container = option.container,
totalPage = option.total,
// perPage = option.size,
currentPage = parseInt(getQueryString('page')) || 1,
pageStr = '';
var breakPage = 5,
currentPosition = 2, //currentPosition 是 breakPage 的中间位置
breakSpace = 2,
maxSpace = 2,
prevNum = currentPage - currentPosition,
nextNum = currentPage + currentPosition;
if (prevNum < 1) prevNum = 1;
if (nextNum > totalPage) nextNum = totalPage;
pageStr += (currentPage == 1) ? '< 前页': '< 前页';
// = prevNum > maxSpace + breakSpace
if (prevNum - breakSpace > maxSpace) {
for (var i=1; i <= breakSpace; i++) pageStr += '' + i + '';
pageStr += '...';
// 28 - 9 + 1 = 20; i < 9; i++
for (var i=totalPage - breakPage + 1; i < prevNum; i++) pageStr += '' + i + '';
} else {
for (var i=1; i < prevNum; i++) pageStr += '' + i + '';
}
//中间隔着的距离刚好是 (nextNum - prevNum + 1) == breakSpace
for (i = prevNum; i <= nextNum; i++) {
pageStr += (currentPage == i) ? '' + i + '': '' + i + '';
}
if (totalPage - breakSpace - nextNum + 1 > maxSpace) {
for (i = nextNum + 1; i <= breakPage; i++) pageStr += '' + i + '';
pageStr += '...';
for (i = totalPage - breakSpace + 1; i <= totalPage; i++) pageStr += '' + i + '';
} else {
for (i = nextNum + 1; i <= totalPage; i++) pageStr += '' + i + '';
}
pageStr += (currentPage == totalPage) ? '后页 >': '后页 >';
$(container).html(pageStr);
}
对应的 CSS
/*分页开始*/
.customer_pager {
font: 14px Arial, Helvetica, sans-serif;
color: #aaa;
margin: 20px 0;
line-height: 150%;
text-align: center;
}
.paginator .prev {
margin-right: 20px;
}
.paginator .next {
margin-left: 20px;
}
.paginator .thispage {
color: #fff;
background: #de533c;
padding: 0 4px;
}
.paginator a:link, .paginator a:visited {
color: #654f41;
}
a:link, a:visited {
color: #985d3e;
}
.paginator a, .thispage, .break {
padding: 0px 4px;
margin: 2px;
}
/*分页结束*/
