参考:http://www.codefans.net/jscss/code/4696.shtml 做了修改,在项目中用到
<!--展示信息-->
<div class="dl-wraps clearfix" id="show_dealers"></div>
<!--展示页码-->
<div class="unify_page" id="page_num_show"></div>
<script type="text/javascript">
var dealer_json = <?= $this->data['dealer_json']?>;//分页的全部罗列json格式数据
//container 容器,count 总页数 pageindex 当前页数
function setPage(container, size, pageindex ,showNum) {
var container = container;
var count = Math.ceil(size/showNum);
var pageindex = pageindex;
var showNum = showNum ? showNum : 4;
var a = [];
//总页数少于10 全部显示,大于10 显示前3 后3 中间3 其余....
if (pageindex == 1) {
a[a.length] = '<a href="javascript:void(0);" class="page_up_no"><b><<</b>上一页</a>';
} else {
a[a.length] = '<a href="javascript:void(0);" class="page_up"><b><<</b>上一页</a>';
}
//总页数小于10
if (count <= 10) {
for (var i = 1; i <= count; i++) {
setPageList();
}
}else {//总页数大于10页
if (pageindex <= 4) {
for (var i = 1; i <= 5; i++) {
setPageList();
}
a[a.length] = "...<a href=\"#\">" + count + "</a>";
} else if (pageindex >= count - 3) {
a[a.length] = "<a href=\"#\">1</a>...";
for (var i = count - 4; i <= count; i++) {
setPageList();
}
}
else { //当前页在中间部分
a[a.length] = "<a href=\"#\">1</a>...";
for (var i = pageindex - 2; i <= pageindex + 2; i++) {
setPageList();
}
a[a.length] = "...<a href=\"#\">" + count + "</a>";
}
}
function setPageList() {
if (pageindex == i) {
a[a.length] = '<span class="active">'+i+'</span>';
} else {
a[a.length] = '<a class="page" href="javascript:void(0)" rel="nofollow">'+i+'</a>';
}
}
if (pageindex == count) {
a[a.length] = '<a href="javascript:void(0);" class="page_down_no" rel="nofollow">下一页<b>>></b></a>';
} else {
a[a.length] = '<a href="javascript:void(0);" class="page_down" rel="nofollow">下一页<b>>></b></a>';
}
var from = (pageindex - 1) * showNum;
var end = pageindex * showNum;
var dealer_list = dealer_json.slice(from,end);
var content = "";
for(var i=0;i<dealer_list.length;i++)
{
content +='<dl class="yc_dealer_dl">'+
'<dt><i></i>'+
'<a>'+dealer_list[i]['sername']+'</a></dt>'+
'<dd>地址:上海市宝山区江杨南路980号</dd>'+
'<dd>电话:4006535996</dd></dl>';
}
container.innerHTML = content;
if(count<2) return false;
document.getElementById("page_num_show").innerHTML = a.join("");
//事件点击
var pageClick = function() {
var oAlink = document.getElementById("page_num_show").getElementsByTagName("a");
var inx = pageindex; //初始的页码
oAlink[0].onclick = function() { //点击上一页
if (inx==1) {
return false;
}
inx--;
setPage(container, size, inx ,4);
return false;
}
for (var i = 1; i < oAlink.length - 1; i++) { //点击页码
oAlink[i].onclick = function() {
inx = parseInt(this.innerHTML);
setPage(container, size, inx ,4);
return false;
}
}
oAlink[oAlink.length - 1].onclick = function() { //点击下一页
if (inx == count) {
return false;
}
inx++;
setPage(container, size, inx ,4);
return false;
}
} ()
}
setPage(document.getElementById("show_dealers"),dealer_json.length,1,4);
</script>