最近学习用PHP做网站,遇到个分页问题,刚好慕课网上有相应视频,就跟着做了一个。这个做个备份,以后直接用就好。
慕课网学习链接:PHP+MySQL分页原理实现
视频中用的是MySQL,我用的是mysqli,都差不多。
先上个效果图(数据是全国省份信息):
以下是我的各阶段代码:
1、页面展示:index.php
<!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>
<link rel="stylesheet" href="css/bootstrap.css" />
<link rel="stylesheet" href="css/css.css" />
<script type="text/javascript" src="js/jquery1.9.0.min.js"></script>
</head>
<body>
<table class="table table-bordered table-hover table-striped" id="tableList" style="table-layout: fixed;">
<tbody>
<tr align="center">
<td><strong>序号</strong></td>
<td><strong>省</strong></td>
<td><strong>市</strong></td>
<td><strong>是否显示</strong></td>
<td><strong>显示顺序</strong></td>
</tr>
<?php
require_once 'services.php';
?>
</tbody>
</table>
</body>
</html>
2、数据加载和分页:services.php
<?php
header("Content-type:text/html;charset=utf-8");
//引入数据库文件
require_once 'DB/DBTools.php';
//实例化对象
$dbTools = new DBTools();
$page=1;//当前页
$page_size=10;//每页显示数量,默认显示10条数据
if(isset($_REQUEST['page'])){//若是有提交page属性,那么就用提交的值,默认为1
$page=$_REQUEST['page'];
}
if(isset($_REQUEST['size'])){//若是有提交page_size属性,那么就用提交的值,默认为10
$page_size=$_REQUEST['size'];
}
//计算出总记录数,用来分页
$sql = "select count(id) from s_cities";
$res = $dbTools->execute_dql($sql);
$total_record = $res->fetch_array()[0];//总记录数
$total_page = ceil($total_record/$page_size);//总页数
$sql="select * from s_cities order by showorder asc,id asc limit ".($page-1)*$page_size.",".$page_size;
$res = $dbTools->execute_dql($sql);
$count=1;
$html="";
while($rows = $res->fetch_assoc()){
$html .="<tr align='center'><td>".$count."</td>";
$html .="<td>".$rows['provice']."</td>";//省份
$html .="<td>".$rows['city']."</td>";//市
$html .="<td>".$rows['isshow']."</td>";//是否显示
$html .="<td>".$rows['showorder']."</td>";//显示顺序
$html .="</tr>";
$count++;
}
$html .="</tbody></table>";
echo $html;
$res->free();
//没有记录数,不分页
if($total_record>0){
//分页
$show_page=5;//每次显示5个分页块
$page_offset = ($show_page-1)/2;//计算偏移量,也就是每次往前或往后移动的数量
$paging_html="<div id='pageGro' >";
$paging_html.="<span class='paging'>总计:共<span id='totalRecord'>".$total_record."</span>条记录 ".$page."/".$total_page."页 ";
$paging_html.="每页显示<input type='text' id='setPageSize' value='".$page_size."' οnkeydοwn='if(event.keyCode==13){setPaging(this,1,".$page_size.",".$total_page.");return false;}'/>条 ";
$paging_html.="去<input type='text' id='toPage' value='' curPage='".$page."' οnkeydοwn='if(event.keyCode==13){setPaging(this,2,".$page_size.",".$total_page.");return false;}'/>页";
//$paging_html.="";
$paging_html.="</span>";
//首页和上一页
if($page>1){
$paging_html.="<div class='pageUp'><a href='".$_SERVER['PHP_SELF']."?page=1&size=".$page_size."'>首页</a></div>";
$paging_html.="<div class='pageUp'><a href='".$_SERVER['PHP_SELF']."?page=".(($page-1)>0?($page-1):1)."&size=".$page_size."'>上一页</a></div>";
}
//加载分页数字块
$start = 1;//第一个分页块
$end = $total_page;//最后一个分页块
//若是总页数比要显示的所有页数多,也就是总页数>5条时,需要显示中间的分页数字块
if($total_page>$show_page){
//添加前省略符
if($page>$page_offset+1){//譬如当前页为6,偏移量+1=3,也就是6前面最多出现3个,就会出现一个...
$paging_html.="<span class='omit'>...</span>";
}
//计算开始和结束分页块的数字
if($page>$page_offset){//当前页>偏移量
$start = $page-$page_offset;//开始页
//结束页
$end = ($total_page>$page+$page_offset)?($page+$page_offset):$total_page;
}else{
$start=1;
$end=($total_page>$show_page)?$show_page:$total_page;
}
if($page+$page_offset>$total_page){
$start = $start-($page+$page_offset-$end);
}
}
$paging_html.="<div class='pageList'><ul>";
for($i=$start;$i<=$end;$i++){
if($page==$i){
$paging_html.="<li class='current'><a href='".$_SERVER['PHP_SELF']."?page=".$i."&size=".$page_size."'>".$i."</a></li>";
}else{
$paging_html.="<li><a href='".$_SERVER['PHP_SELF']."?page=".$i."&size=".$page_size."'>".$i."</a></li>";
}
}
$paging_html.="</ul></div>";
//添加后省略符
if($total_page>$show_page && $total_page>$page+$page_offset){
$paging_html.="<span class='omit'>...</span>";
}
//尾页和下一页
if($page<$total_page){
$paging_html.="<div class='pageDown'><a href='".$_SERVER['PHP_SELF']."?page=".(($page+1)>$total_page?$total_page:($page+1))."&size=".$page_size."'>下一页</a></div>";
$paging_html.="<div class='pageDown'><a href='".$_SERVER['PHP_SELF']."?page=".$total_page."&size=".$page_size."'>尾页</a></div>";
}
$paging_html.="</div>";
echo $paging_html;
}
?>
3、数据库查询:DBTools.php
<?php
class DBTools{
private $mysqli=null;//mysqli对象
private static $host="127.0.0.1";//主机名
private static $user="root";//用户名
private static $pwd="root";//密码
private static $db="test";//数据库
function __construct(){
$this->mysqli=new mysqli(self::$host,self::$user,self::$pwd,self::$db);
if($this->mysqli->connect_error){//连接失败
die("连接失败".$this->mysqli->connect_error);
}
//设置访问数据库的字符集
//保证PHP是以uft8的方式来操作mysql数据库的
$this->mysqli->query("set names utf8");
}
//查询
public function execute_dql($sql){
$res = $this->mysqli->query($sql) or die("操作失败,原因".$this->mysqli->error);
return $res;
}
//添加、修改和删除
public function execute_dml($sql){
$res = $this->mysqli->query($sql) or die("操作失败,原因".$this->mysqli->error);
if(!$res){//说明操作失败
return 0;
}else{
if($this->mysqli->affected_rows>0){
return 1;//说明操作成功
}else{
return 2;//说明没有受到影响的行
}
}
}
}
?>
4、设置每页显示数量和跳转到指定页所用JS:
/** * 该方法用来设置每页显示数量/跳转到指定页数 * @param obj:当前input对象 * @param flag:1-设置每页的数量 2-跳转到指定的页数 * @param pageSize:每页显示的记录数 * @pram totalPages:总页数 */ function setPaging(obj,flag,pageSize,totalPages){ var value = obj.value; value = jQuery.trim(value); //没有数据不处理 if(value<0){return false;} if(isNaN(value)){//不是数字,不处理 obj.value="";//置空 return false; } //进行转换 value = parseInt(value,10); pageSize = parseInt(pageSize,10); flag = parseInt(flag,10); totalPages = parseInt(totalPages,10); switch(flag){ case 1:{//调整每页显示数量 //没有改变数量不处理 if(value==pageSize){return false;} window.location.href="index.php?size="+value; break; } case 2:{//跳转到指定的页 var curPage = $(obj).attr("curPage"); curPage = parseInt(curPage,10); //若是就在当前页那么不处理 if(value==curPage){ return false;} //或者输入值大于总页数,那么就跳转到最后一页 if(value>totalPages){value = totalPages;} window.location.href="index.php?page="+value+"&size="+pageSize; break; } } }
注:
1、输入数字回车后才会调用setPaging()方法,在input框中有声明:οnkeydοwn='if(event.keyCode==13){setPaging(this,1,".$page_size.",".$total_page.");return false;}'
2、分页模块显示数字那段,业务逻辑有点复杂,可以点击这里听听老师的解释;(本人不才,没大听懂)
3、记得导入jquery1.9.0.min.js;
4、文章用到的各个文件以及表结构和数据已经以附件的形式上传,有需要的可以下载。