![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
Correction status：Uncorrected
Teacher's comments：
Collection
Collection
index.php
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>分页</title>
<style>
table,th,td {
border: 1px solid black;
}
table th {
background-color: lightskyblue;
}
table {
border-collapse: collapse;
width: 70%;
margin: 30px auto;
text-align: center;
}
h3 {
text-align: center;
}
h3 a {
text-decoration: none;
margin-left: 10px;
border: 1px solid black;
display: inline-block;
height: 30px;
min-width: 30px;
padding: 0 10px;
background-color: lightgreen;
}
h3 a:hover, .active {
background-color: red;
color: white;
}
form {
display: inline;
}
</style>
</head>
<body>
<?php
// 连接数据库获取到全部记录
// 导入分野函数库
require './func_page.php';
$db = mysqli_connect('127.0.0.1', 'gakkispy', 'password', 'php');
$page = isset($_GET['p']) ? $_GET['p'] : 1;
$num = 5;
$table = 'staff';
// 调用分页函数
$data = func_page($db, $table, $page, $num);
// 当前分页数据
$rows = $data['rows'];
// 总页数
$pages = $data['pages'];
// 如果当前变成为了0,则强制修改为1,否则就是当前页数
// 如果大于总页数,则强制修改为总页数,否则就是当前页数
if ($page == 0) {
$page = 1;
} else if ($page > $pages) {
$page = $pages;
}
?>
<table>
<caption><h2>员工信息表</h2></caption>
<tr>
<th>ID</th>
<th>姓名</th>
<th>年龄</th>
<th>性别</th>
<th>工资</th>
</tr>
<?php foreach ($rows as $row) : ?>
<tr>
<td><?php echo $row['staff_id']; ?></td>
<td><?php echo $row['name']; ?></td>
<td><?php echo $row['age']; ?></td>
<td><?php echo $row['sex']; ?></td>
<td><?php echo $row['salary']; ?></td>
</tr>
<?php endforeach;?>
</table>
<h3>
<!-- 当前是第一页的时候,上一页和首页链接应该不显示 -->
<?php if ($page !=1): ?>
<a href="?p=1">首页</a>
<a href="?p=<?php echo $page-1; ?>">上一页</a>
<?php endif; ?>
<!-- 页码 -->
<?php for($i=1; $i<=$pages; $i++): ?>
<a class="<?php if($_GET['p'] == $i ) {echo 'active';} ?>" href="?p=<?php echo $i ?>"><?php echo $i ?></a>
<?php endfor;?>
<!-- 当前已经是最后一页的时候,下一页和最后一页也应该不显示 -->
<?php if ($page !=$pages) : ?>
<a href="?p=<?php echo $page+1;?>">下一页</a>
<a href="?p=<?php echo $pages; ?>">尾页</a>
<?php endif; ?>
<!-- 实现页面的快速跳转 -->
<form action="" method="get">
第
<select name="p" id="">
<?php for($i=1; $i<=$pages;$i++): ?>
<!-- 循环输出全部页码,并锁定当前页 -->
<option value="<?php echo $i; ?>" <?php if(isset($_GET['p']) && $_GET['p'] == $i){echo 'selected';} ?>>
<?php echo $i; ?>
</option>
<?php endfor; ?>
</select>
页
<button>跳转</button>
</form>
</h3>
</body>
</html>点击 "运行实例" 按钮查看在线实例
func_page.php 函数封装部分
<?php
if (!function_exists('func_page')) {
function func_page($db, $table, $page=1, $num=5)
{
$offset = ($page-1)*$num;
$sql = "SELECT * FROM {$table} LIMIT {$offset} , {$num};";
$res = mysqli_query($db, $sql);
$rows = mysqli_fetch_all($res, MYSQLI_ASSOC);
// 获取总页数分2步:1.获取总记录数,2.再除以每次的显示数量,结果向上取整
$number = mysqli_query($db, "SELECT COUNT(*) FROM {$table}");
// 总记录数保存到变量$total中
list($total) = mysqli_fetch_row($number);
// 获取到总页数 $pages
$pages = ceil($total / $num);
// 返回当前分页数据与总页数
return ['rows' => $rows, 'pages' => $pages];
}
}点击 "运行实例" 按钮查看在线实例
