Collection
Collection
本次作业练习，通过使用Mysql的PDO预处理技术来实现数据列表的分页功能。
页面前端效果采用Bootstrap布局和分页，并且实现分页越界禁用效果。
页面效果截图：
数据库表：
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
<?php
/*
*
*/
header('Content-Type:text/html; charset=UTF-8');
$page = isset($_GET['p'])? $_GET['p']:1;
$page = ($page <= 0 ) ? 1 : $page;
$num = 5; // 每页显示的条数
// 创建PDO数据库连接对象
$pdo = new PDO('mysql:dbname=demo','root', 'root');
//计算共计多少页
$pdoStmt2 = $pdo->prepare("SELECT * FROM user1");
$pdoStmt2->execute();
$totalPage = ceil($pdoStmt2->rowCount() / $num); //ceil() 函数向上舍入为最接近的整数。算出总共的页数
$page = ($page >= $totalPage) ? $totalPage : $page;
$offset = ($page-1)*$num; // 偏移量，从这个数量的条数开始显示，即显示的起始位置
//获取到所有数据,用表格显示出来
$sql = "SELECT `id`,`name`,`email` FROM `user1` LIMIT :offset, :num";
$pdoStmt = $pdo->prepare($sql);
$pdoStmt->bindParam(':offset', $offset, PDO::PARAM_INT); // PDO::PARAM_INT是调用了PDO的一个常量PARAM_INT，这个参数要求绑定的数据必须是数字类型
$pdoStmt->bindParam(':num', $num, PDO::PARAM_INT);
$res = $pdoStmt->execute();
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<!-- 导入bootstrap样式表-->
<link rel="stylesheet" href="bootstrap-3.3.7-dist/css/bootstrap.css">
<!-- 导入jquery库脚本,要在bootstrap脚本之前导入-->
<script src="jquery-3.2.1.js"></script>
<!-- 导入bootstrap js脚本-->
<script src="bootstrap-3.3.7-dist/js/bootstrap.js"></script>
<style>
.tbclass {
text-align: center;
}
.tbclass th {
text-align: center;
background-color: #ff8500;
}
</style>
</head>
<body>
<div class="container">
<div class="row">
<div class="col-md-4"></div>
<div class="col-md-4 text-center"><h3>用户信息列表</h3></div>
<div class="col-md-4"></div>
</div>
<div class="row">
<div class="col-md-2"></div>
<div class="col-md-8">
<table class="table table-bordered table-hover tbclass">
<tr>
<th>ID</th>
<th>用户名</th>
<th>邮箱</th>
</tr>
<?php
foreach ($pdoStmt as $row) {
echo '<tr>';
echo '<td>'.$row['id'].'</td><td>'.$row['name'].'</td><td>'.$row['email'].'</td>';
echo '</tr>';
}
?>
</table>
</div>
<div class="col-md-2"></div>
</div>
<div class="row">
<div class="col-md-4"></div>
<div class="col-md-4 text-center">
<!-- 分页标签开始-->
<nav aria-label="Page navigation">
<ul class="pagination">
<?php
echo '<li><a href="?p=1">首页</a></li>';
echo '<li><a href="?p=';
echo (($page-1)==0)?1:($page-1);
echo '" aria-label="Previous"><span aria-hidden="true">«</span></a></li>';
for ($i=1; $i<=$totalPage; $i++) {
echo '<li';
if ($page == $i){
echo ' ';
}
echo '><a href="?p='.$i.'">'.$i.'</a></li>';
}
echo '<li';
echo ($page==$totalPage)?' ':'';
echo '><a href="?p=';
echo ($page >= $totalPage) ? $totalPage : ($page+1);
echo '" aria-label="Next"><span aria-hidden="true">»</span></a></li>';
echo '<li><a href="?p='.$totalPage.'">尾页</a></li>';
?>
<!---->
<!-- <li><a href="#" aria-label="Previous"><span aria-hidden="true">«</span></a></li>-->
<!-- <li><a href="#">1</a></li>-->
<!-- <li><a href="#">2</a></li>-->
<!-- <li><a href="#">3</a></li>-->
<!-- <li><a href="#">4</a></li>-->
<!-- <li><a href="#">5</a></li>-->
<!-- <li><a href="#" aria-label="Next"><span aria-hidden="true">»</span></a></li>-->
</ul>
</nav>
<!-- 分页标签结束 -->
</div>
<div class="col-md-4"></div>
</div>
<div class="row">
</div>
</div>
</body>
</html>