<!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>结合jquery做ajax分页</title>
<style>
body{ font-size:12px; font-family:Verdana, Arial, Helvetica, sans-serif}
.page A{ padding:3px 5px; float:left; border:solid #CCCCCC 1px; text-decoration:none; font-size:12px; margin-left:1px; font-family:Verdana;color:#000000;}
.page A.currentpage{ color:#FF0000; border: solid red 1px;}
.page A:hover{ background-color:#CCCCCC;}
</style>
<script language="javascript" src="jquery-1.9.1.js"></script>
</head>
<body>
<?php
include_once('conn.php');
//PHP分页实例
//分页尺寸
$page_size=2;
//计算总行数
$total_records=mysql_num_rows(mysql_query("SELECT goodsId from goods;"));
//总页数
$total_page=ceil($total_records/$page_size);
$query=mysql_query("select * from goods limit 0,$page_size");
?>
<div class="recordlist">
<ul>
<?
while ($rs=mysql_fetch_array($query))
{
?>
<li><?=$rs["userName"]?></li>
<?
}
?>
</ul>
</div>
<div class='page'></div>
</body>
</html>
<script language="javascript">
var total_page=<?=$total_page?>;
var url="page5.php?page";//当前链接,格式如下,例如:?aa=1&page ,somepage.php?action=1&cat=1&page
$().ready(function(){
$(".page").html(pagination(1))
page_link();
})
function page_link()
{
$(".page A").click(function(){
var page=parseInt($(this).attr("page"))
$(".recordlist").load($(this).attr("href"),"",function(){$(".page").html(pagination(page));page_link();})
return false;
})
}
function pagination(current_page)
{
//翻页链接开始
current_page = current_page<=0 ? 1 : current_page;
current_page = current_page>total_page?total_page:current_page;
var page_link="";
if (total_page>1)
{
page_link="<a>一共"+total_page+"页</a>";
page_link+="<a>当前第"+current_page+"页</a>";
page_link+="<a href="+url+"=1 page=1>首页</a>";
if (current_page>1){
//页码大于1的时候,显示上一页翻页链接
var pre_page=current_page-1;
page_link+="<a href='"+url+"="+pre_page+"' page="+pre_page+"><<</a>";
}
//翻页列表
//步进分页,翻页列表的数字始终只显示9个或者自定义的个数,本例定义只显示9个,当前页左右各显示4个页码
if (total_page>9)
{
if (current_page>4)
{
var from=current_page-4;
var to=current_page+4;
if (to>total_page)
{
var from=total_page-8;
var to=total_page;
}
}
else
{
var from=1;
var to=9;
}
}
else
{
var from=1;
var to=total_page;
}
for (var i=from;i<=to;i++)
{
if (i==current_page)
{
//高亮当前页页码
page_link+="<a href='"+url+"="+i+"' class='currentpage' page="+i+">"+i+"</a>";
}
else
{
page_link+="<a href='"+url+"="+i+"' page="+i+" page="+i+">"+i+"</a>";
}
}
//页码小于总页数的时候显示下一页翻页链接
var next_page=current_page+1;
if(next_page<total_page)
{
page_link+="<a href='"+url+"="+next_page+"' page="+next_page+">>></a>";
}
page_link+="<a href='"+url+"="+total_page+"' page="+total_page+">最后一页</a>";
}
return page_link;
}
</script>
<?php
session_start();
include_once("conn.php");
?>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="js/jquery-1.7.1.js"></script>
<script src="js/myjs.js"></script>
<link href="mydiv.css" rel="stylesheet" type="text/css"/>
<script language="javascript">
</script>
<body >
<!--div固定框架-->
<div class="bg_base">
<!--页面头部框架-->
<div class="bg_herd">
<div class="bg_herdtext">
Welcome to my supermarket
</div>
<div id="herdfont" class="bg_herdfontright">
<p>
<a href="#">您好! 欢迎来到我的电子商城,快来抢购吧!</a>
</p>
<p>
<a href="#">注册</a>|<a href="#">登录 </a>
</p>
</div>
<!--页面头部结束-->
</div>
<!--中部导航条开始-->
<div id="nav">
<a href="#" class="firstnar">商品分类</a>
<a href="indexMain.php" class="twonar">首页</a>
<a href="#" class="stnar">特价促销</a>
<a href="#" class="stnar">天然燕窝</a>
<a href="#" class="stnar">名贵药材</a>
<a href="#" class="stnar">山珍海味</a>
<a href="#" class="stnar">中医药材</a>
</div>
<!--左边上第一个div开始-->
<div class="bg_midupter">
<dt>
<a href="#">商品系列</a>
</dt>
<dd>
<a href="cleckHqs.php">> 花旗人参</a>
</dd>
<dd>
<a href="#">> 天然燕窝</a>
</dd>
<dd>
<a href="#">> 名贵药材</a>
</dd>
<dd>
<a href="#">> 山珍海味</a>
</dd>
<dd>
<a href="#">> 中医药材</a>
</dd>
<dd>
<a href="#">> 中式汤料</a>
</dd>
<dd>
<a href="#">> 特色食品</a>
</dd>
<div class="newtitle">
<span>特价促销动态</span>
<a href="#">更多</a>
</div>
<ul class="ulnews">
</ul>
<div class="newtitle">
<span>联系我们</span>
<a href="#"></a>
</div>
<ul id="ulcolos">
<li>
<span>联系方式:</span>
<a href="#">清华科技园</a>
</li>
</ul>
</div>
<!--搜索开始-->
<div class="serverbg">
<form action="server_fom.php" method="post">
<div class="serverbase">
<span>
<img src="images/serveriom.jpg"/>
<input value="在这里搜索你要的商品...." id="clstext" name="clstext" οnfοcus="javascript:if(this.value=='在这里搜索你要的商品....')this.value='';"/>
</span>
<input type="submit" value="搜 索" id="servers" />
</div>
</form>
</div>
<!--上部图片切换开始-->
<div class="middleImg"><img src="images/nest2oz.jpg" /><span>
<a href="#">1</a>
<a href="#">2</a>
<a href="#">3</a>
<a href="#">4</a>
</span>
</div>
<!-- certrbr-->
<div class="centerbr">
<span>全部商品</span>
<a href="#">更多</a>
</div>
<div class="showpic">
<table class="talbstyl">
<tr>
<?php
$Page_size=8;
/*$sql="select g.goodsName,g.goodsPrice,g.goodsCounts,g.goodsDsep,g.goodsImg,r.atterName,t.typeName from goods g inner join goods_atter r on g.atterId=r.atterId
inner join goods_type t ON g.typeId=t.typeId limit 0,$page_size";
$result=mysql_query($sql,$con);
$count=mysql_num_rows($result);
$page_count = ceil($count/$Page_size);*/
$result=mysql_query('select g.goodsName,g.goodsPrice,g.goodsCounts,g.goodsDsep,g.goodsImg,r.atterName,t.typeName from goods g inner join goods_atter r on g.atterId=r.atterId
inner join goods_type t ON g.typeId=t.typeId');
$count = mysql_num_rows($result);
$page_count = ceil($count/$Page_size);
$i=0;
$init=1;
$page_len=7;
$max_p=$page_count;
$pages=$page_count;
//判断当前页码
if(empty($_GET['page'])||$_GET['page']<0){
$page=1;
}else {
$page=$_GET['page'];
}
$offset=$Page_size*($page-1);
$sql="select g.goodsName,g.goodsPrice,g.goodsCounts,g.goodsDsep,g.goodsImg,r.atterName,t.typeName from goods g inner join goods_atter r on g.atterId=r.atterId
inner join goods_type t ON g.typeId=t.typeId limit $offset,$Page_size";
$result=mysql_query($sql,$con);
while($row = mysql_fetch_array($result)){
$goodsName=$row['goodsName'];
$showImg=$row['goodsImg'];
$goodsPrice=$row['goodsPrice'];
$goodsCounts=$row['goodsCounts'];
$goodsDsep=$row['goodsDsep'];
$atterName=$row['atterName'];
$typeName=$row['typeName'];
$i++;
echo "<td align='center'><a href='#'><img src='$showImg'/><p style='color:red;font-weight:bold;'>$goodsName($typeName)</p><p style='color:red;font-weight:bold;'>[$atterName]</p><p style='color:mediumBlue;'>价格:¥$goodsPrice</p><p>$goodsDsep</p></a></td>";
if($i==4){
echo"</tr><tr></tr>";
}
?>
<?php
}
$page_len = ($page_len%2)?$page_len:$pagelen+1;//页码个数
$pageoffset = ($page_len-1)/2;//页码个数左右偏移量
$key='<div class="page">';
$key.="<span>$page/$pages</span> "; //第几页,共几
if($page!=1){
$key.="<a href=\"".$_SERVER['PHP_SELF']."?page=1\">第一页</a> "; //第一页
$key.="<a href=\"".$_SERVER['PHP_SELF']."?page=".($page-1)."\">上一页</a>"; //上一页
}else {
$key.="第一页 ";
$key.="上一页";
}
if($pages>$page_len){
//如果当前页小于等于左偏移
if($page<=$pageoffset){
$init=1;
$max_p = $page_len;
}else{//如果当前页大于左偏移
//如果当前页码右偏移超出最大分页数
if($page+$pageoffset>=$pages+1){
$init = $pages-$page_len+1;
}else{
//左右偏移都存在时的计算
$init = $page-$pageoffset;
$max_p = $page+$pageoffset;
}
}
}
for($i=$init;$i<=$max_p;$i++){
if($i==$page){
$key.=' <span>'.$i.'</span>';
} else {
$key.=" <a href=\"".$_SERVER['PHP_SELF']."?page=".$i."\">".$i."</a>";
}
}
if($page!=$pages){
$key.=" <a href=\"".$_SERVER['PHP_SELF']."?page=".($page+1)."\">下一页</a> ";//下一页
$key.="<a href=\"".$_SERVER['PHP_SELF']."?page={$pages}\">最后一页</a>"; //最后一页
}else {
$key.="下一页 ";
$key.="最后一页";
}
$key.='</div>';
mysql_close();
?>
</table>
</div>
<!--外框div结束-->
</div>
</body>
</html>