当前位置:首页 > PHP

php分页实现跳转

2026-02-16 16:04:38PHP

PHP 分页实现跳转

数据库查询与分页逻辑

使用 LIMIT 子句控制每页显示的数据量,结合 $_GET 获取当前页码。假设每页显示 10 条数据:

$page = isset($_GET['page']) ? (int)$_GET['page'] : 1;
$perPage = 10;
$offset = ($page - 1) * $perPage;

$sql = "SELECT * FROM articles LIMIT $offset, $perPage";
$result = $conn->query($sql);

计算总页数

通过数据库查询获取总记录数,并计算总页数:

php分页实现跳转

$totalSql = "SELECT COUNT(*) as total FROM articles";
$totalResult = $conn->query($totalSql);
$totalRows = $totalResult->fetch_assoc()['total'];
$totalPages = ceil($totalRows / $perPage);

生成分页链接

通过循环生成页码链接,并添加当前页高亮样式:

echo '<div class="pagination">';
for ($i = 1; $i <= $totalPages; $i++) {
    $active = $i == $page ? 'active' : '';
    echo "<a href='?page=$i' class='$active'>$i</a>";
}
echo '</div>';

添加样式(CSS)

为分页链接添加基础样式:

php分页实现跳转

.pagination a {
    padding: 8px 16px;
    border: 1px solid #ddd;
    margin: 0 4px;
}
.pagination a.active {
    background-color: #4CAF50;
    color: white;
}

优化跳转功能

添加首页/末页跳转按钮,并限制页码范围:

if ($page > 1) {
    echo "<a href='?page=1'>首页</a>";
    echo "<a href='?page=".($page-1)."'>上一页</a>";
}

if ($page < $totalPages) {
    echo "<a href='?page=".($page+1)."'>下一页</a>";
    echo "<a href='?page=$totalPages'>末页</a>";
}

安全性处理

对页码参数进行过滤,防止 SQL 注入和无效输入:

$page = max(1, min($totalPages, $page)); // 限制页码范围

标签: 分页跳转
分享给朋友:

相关文章

js实现跳转

js实现跳转

使用 window.location 跳转 通过修改 window.location.href 或直接使用 window.location 实现页面跳转,适用于普通跳转或带参数的 URL。 // 方…

h5实现登录页面跳转

h5实现登录页面跳转

实现登录页面跳转的基本方法 使用HTML5和JavaScript实现登录页面跳转,可以通过表单提交或JavaScript事件触发。以下是几种常见方式: 表单提交跳转 在HTML中创建一个表单,通过…

jquery跳转

jquery跳转

jQuery 页面跳转方法 使用 jQuery 实现页面跳转有多种方式,以下是几种常见的方法: 使用 window.location.href $(document).ready(functi…

jquery 分页

jquery 分页

实现 jQuery 分页的方法 客户端分页实现 使用 jQuery 实现客户端分页的核心思路是通过 JavaScript 控制数据的显示与隐藏。假设有一个包含数据的 HTML 列表或表格: // 分…

vue前端实现分页

vue前端实现分页

实现分页的基本思路 在Vue中实现分页通常需要结合后端API返回的数据和前端的分页组件。核心逻辑包括计算总页数、处理当前页码变化以及动态加载数据。 使用Element UI的分页组件 Elemen…

vue点击跳转实现

vue点击跳转实现

vue点击跳转实现方法 在Vue中实现点击跳转可以通过多种方式完成,以下是几种常见的方法: 使用router-link组件 Vue Router提供了router-link组件用于声明式导航,适合…