1.项目中使用的分页
html:
<div class="pagess clearfix"></div>
css:
.pagess {
margin: 20px auto;
text-align: center;
}
.clearfix {
zoom: 1;
}
.pagess a {
display: inline-block;
height: 28px;
border: 1px solid #e7e7e7;
margin-left: 5px;
line-height: 30px;
font-size: 14px;
padding: 0 10px;
}
.pagess .adisabled {
display: inline-block;
height: 28px;
border: 1px solid #e7e7e7;
line-height: 30px;
font-size: 14px;
margin-left: 5px;
cursor: pointer;
background: #ccc;
padding: 0 10px;
}
.pagess span {
height: 28px;
border: 1px solid #e7e7e7;
font-size: 14px;
padding: 0 10px;
}
.pagess .current {
background: #FFD600;
}
.pagess a {
display: inline-block;
height: 28px;
border: 1px solid #e7e7e7;
margin-left: 5px;
line-height: 30px;
font-size: 14px;
padding: 0 10px;
}
js:
/**
* 分页相关-通用方法库
*/
//获取分页html
function getPageHtml(params) {
//当前url
var currUrl = window.location.href;
//参数验证
pageNum = params.pageNum > 0 ? parseInt(params.pageNum) : 1;
pageSize = params.pageSize > 0 ? parseInt(params.pageSize) : 20;
totalNum = params.totalNum > 0 ? parseInt(params.totalNum) : 20;
showNum = params.showNum > 0 ? parseInt(params.showNum) : 8;
currClass = params.currClass != '' ? params.currClass : 'current';
showTotal = params.showTotal ? true : false;
pageName = params.pageName ? params.pageName : 'page';
//只有一页 返回空
if (totalNum <= pageSize || pageSize <= 0) {
return '';
}
//计算总页数
var pageTotal = Math.ceil(totalNum / pageSize);
//当前页大于总页数,返回第一页
if (pageNum > pageTotal) {
pageNum = 1;
}
var firstNav = '';
var lastNav = '';
if (params.showFirstLast) {
var firstNav = _getPageUnit(1, "首页", currUrl, '', pageName);
var lastNav = _getPageUnit(pageTotal, "尾页", currUrl, '', pageName);
}
var prevNav = '';
var nextNav = '';
if (pageNum > 1) {
prevNav = _getPageUnit((pageNum > 1 ? pageNum - 1 : 1), "上一页", currUrl, '', pageName);
} else {
prevNav = '<span class="adisabled " paged="上一页">上一页 </span>';
}
if (pageNum < pageTotal) {
nextNav = _getPageUnit((pageNum < pageTotal ? pageNum + 1 : pageTotal), "下一页", currUrl, '', pageName);
} else {
nextNav = '<span class="adisabled" paged="下一页">下一页 </span>';
}
var midPageNum = Math.floor(showNum / 2);
var startPage = Math.max.apply(null, [Math.min.apply(null, [pageNum - midPageNum, pageTotal - showNum + 1]), 1]);
var endPage = Math.min.apply(null, [Math.max.apply(null, [pageNum + midPageNum, showNum]), pageTotal]);
var amongNav = '';
var navCss = '';
for (i = startPage; i <= endPage; i++) {
navCss = (i == pageNum) ? ' class="' + currClass + '"' : '';
amongNav += _getPageUnit(i, i, currUrl, navCss, pageName);
}
var totalNav = '';
if (showTotal) {
totalNav = '<span class="page-all">共' + totalNum + '条</span>';
}
return '<div class="clearfix M_pages M_pages1">'
+ firstNav + prevNav + amongNav + nextNav + lastNav + totalNav
+ '</div>';
}
//分页单元链接html
function _getPageUnit(currPageNum, txt, currUrl, navCss, pageName) {
var navCss = navCss ? navCss : '';
//替换url某个参数值
var pattern = pageName + '=([^&]*)';
var replaceTxt = pageName + '=' + currPageNum;
var _navUrl = '';
if (currUrl.match(pattern)) {
var tmp = '/(' + pageName + '=)([^&]*)/gi';
_navUrl = currUrl.replace(eval(tmp), replaceTxt);
} else {
if (currUrl.match('[\?]')) {
_navUrl = currUrl + '&' + replaceTxt;
} else {
_navUrl = currUrl + '?' + replaceTxt;
}
}
return "<a href='" + _navUrl + "' target='_self' " + navCss + ">" + txt + " </a >";
}
//获取分页跳转url
function _getJumpPageUrl(currUrl, currPageNum) {
return changeUrlArg(currUrl, 'page', currPageNum);
}
/**
* url相关-通用方法库
*/
//获取url参数
function getUrlParam(name) {
//构造一个含有目标参数的正则表达式对象
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
//匹配目标参数
var r = window.location.search.substr(1).match(reg);
//返回参数值
if (r != null) {
return unescape(r[2]);
}
return null;
}
//替换url某个参数值
function changeUrlArg(url,arg,arg_val) {
if (url == '') {
url = window.location.href;
}
var pattern=arg+'=([^&]*)';
var replaceText=arg+'='+arg_val;
if(url.match(pattern)) {
var tmp='/('+ arg+'=)([^&]*)/gi';
tmp=url.replace(eval(tmp),replaceText);
return tmp;
} else {
if(url.match('[\?]')) {
return url+'&'+replaceText;
} else {
return url+'?'+replaceText;
}
}
// return url+'\n'+arg+'\n'+arg_val;
}
//解析url
function parseUrl(url) {
if (url == '') {
url = window.location.href;
} else {
var a = document.createElement('a');
a.href = url;
}
return {
source: url,
protocol: a.protocol.replace(':',''),
host: a.hostname,
port: a.port,
query: a.search,
params: (function(){
var ret = {},
seg = a.search.replace(/^\?/,'').split('&'),
lengthen = seg.length, i = 0, s;
for (;i<len;i++) {
if (!seg[i]) {
continue;
}
s = seg[i].split('=');
ret[s[0]] = s[1];
}
return ret;
})(),
file: (a.pathname.match(/\/([^\/?#]+)$/i) || [,''])[1],
hash: a.hash.replace('#',''),
path: a.pathname.replace(/^([^\/])/,'/$1'),
relative: (a.href.match(/tps?:\/\/[^\/]+(.+)/) || [,''])[1],
segments: a.pathname.replace(/^\//,'').split('/')
};
}
// 获取当前日期的前几天的日期
function getBeforeDate(n) {
var n = n;
var d = new Date();
var year = d.getFullYear();
var mon=d.getMonth()+1;
var day=d.getDate();
if(day <= n){
if(mon>1) {
mon=mon-1;
}
else {
year = year-1;
mon = 12;
}
}
d.setDate(d.getDate()-n);
year = d.getFullYear();
mon=d.getMonth()+1;
day=d.getDate();
s = year+"-"+(mon<10?('0'+mon):mon)+"-"+(day<10?('0'+day):day);
return s;
}
当然,也可以自己引用jquery.page.js插件。