自己整的js分页

2012年12月23日 发表评论 阅读评论

在网上找了很多js分页,但都不是我想要的,所以自己整了个。

代码如下(有PHP代码哦):

<?php
	if(isset($_GET['page'])){
	    $page = (int)$_GET['page'];
	}else{
        $page = 1;
    }
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>分页</title>
<script type="text/javascript" src="open_js/jquery.js"></script>
<style type="text/css">
body,*{ padding:0px; margin:0px; font-size:12px;}
ol,li{ list-style:none;}
a{ text-decoration:none;}
.pagebar{ padding:20px 0;}
.pagebar ul{height:25px;}
.pagebar li{ float:left; width:40px; margin-right:10px; background:#99CC00; text-align:center; line-height:25px;}
.pagebar li a{ display:block; color:#000;}
.pagebar li:hover{ background:#389FDA; font-weight:bold;}
.pagebar .active{ background:#389FDA;}
.pagebar .active a{ font-weight: bold;}
.pagebar .dark{ background: #ccc; cursor: pointer;}
.pagebar .p-lang{ width: 100px;}
.pagebar .dark:hover{ background: #ccc;font-weight:normal;}
</style>
<script type="text/javascript">
function xpage(nowPage,totalPage,leftPage,nowTotalPage,url) {
    var prev = 1;
    if(nowPage-1>0) prev = nowPage-1;
    var next = totalPage;
    if(nowPage+1<totalPage) next = nowPage+1;
	var first = '';
	if(nowPage == 1) first = 'dark';
    var frontPage = '<ul><li class="'+first+' p-lang"><a href="'+url+'1">&lt;&lt; Front</a></li>';
    var prevPage = '<li class="'+first+'"><a href="'+url+prev+'">&lt;&lt;</a></li>';
    var left = 1;
    var right = nowTotalPage;
    if(nowPage > leftPage) {
        left = nowPage-leftPage;
        right = nowPage+2;
    }
    if(right > totalPage) right=totalPage;
    var pageList = '';
    for(var i=left; i<=right; i++) {
        if(i == nowPage){
            pageList += '<li class="active"><a href="javascript:;">'+i+'</a></li>';
        }else{
            pageList += '<li><a href="'+url+i+'">'+i+'</a></li>';
        }
    }
	var last = '';
	if(nowPage == totalPage) last = 'dark';
    var nextPage = '<li class="'+last+'"><a href="'+url+next+'">&gt;&gt;</a></li>';
    var lastPage = '<li class="'+last+' p-lang"><a href="'+url+totalPage+'">Last &gt;&gt;</a></li></ul>';
    $('#pageBar').html(frontPage+prevPage+pageList+nextPage+lastPage);
}
</script>
</head>
<body>
<div id="pageBar" class="pagebar"></div>
<script>
xpage(<?=$page?>,12,2,5,'?page='); //当前页码, 总页数, 左边数, 当前分页数, url

// 首页 上一页 3 4 5 6 7 下一页 末页
</script>
</body>
</html>

 


转载请注明来自:[MSN Spaces]http://msn.shandian.biz/445.html

  1. 本文目前尚无任何评论.