当前位置:首页 > PHP

php实现分页步骤

2026-02-15 05:24:58PHP

连接数据库并获取数据

使用PDO或MySQLi连接数据库,执行SQL查询获取总数据量。例如:

$pdo = new PDO("mysql:host=localhost;dbname=test", "username", "password");
$totalQuery = $pdo->query("SELECT COUNT(*) FROM products");
$totalItems = $totalQuery->fetchColumn();

计算分页参数

确定当前页码、每页显示数量及总页数:

$itemsPerPage = 10;
$currentPage = isset($_GET['page']) ? max(1, (int)$_GET['page']) : 1;
$totalPages = ceil($totalItems / $itemsPerPage);
$offset = ($currentPage - 1) * $itemsPerPage;

查询当前页数据

使用LIMIT子句获取当前页数据:

php实现分页步骤

$stmt = $pdo->prepare("SELECT * FROM products LIMIT :offset, :limit");
$stmt->bindValue(':offset', $offset, PDO::PARAM_INT);
$stmt->bindValue(':limit', $itemsPerPage, PDO::PARAM_INT);
$stmt->execute();
$results = $stmt->fetchAll(PDO::FETCH_ASSOC);

生成分页导航

创建可点击的分页链接:

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

显示数据和分页控件

将查询结果和分页导航输出到页面:

php实现分页步骤

foreach ($results as $row) {
    echo "<div>{$row['product_name']}</div>";
}
echo "<div class='pagination'>$pagination</div>";

样式优化(可选)

添加CSS美化分页导航:

.pagination a {
    padding: 5px 10px;
    margin: 0 2px;
    border: 1px solid #ddd;
}
.pagination a.active {
    background-color: #007bff;
    color: white;
}

安全注意事项

对用户输入的页码进行过滤:

$currentPage = filter_input(INPUT_GET, 'page', FILTER_VALIDATE_INT, [
    'options' => ['default' => 1, 'min_range' => 1]
]);

标签: 分页步骤
分享给朋友:

相关文章

uniapp 分页组件

uniapp 分页组件

uniapp 分页组件实现方法 在uniapp中实现分页功能,可以通过自定义组件或使用第三方组件库完成。以下是几种常见实现方式: 自定义分页组件 创建一个名为uni-pagination的组件,模板…

vue加载实现分页

vue加载实现分页

Vue 实现分页加载的方法 使用 Element UI 的分页组件 安装 Element UI 后,可以直接使用其分页组件。在模板中添加分页组件,并绑定相关事件和数据。 <template&g…

vue分页代码实现

vue分页代码实现

Vue 分页代码实现 在 Vue 中实现分页功能通常需要结合后端 API 返回的数据和前端的分页组件。以下是一个完整的实现示例,包括分页组件的封装和与后端数据的交互。 分页组件封装 创建一个…

vue实现假分页

vue实现假分页

实现假分页的基本思路 假分页(前端分页)指在一次性获取所有数据后,通过前端逻辑对数据进行分页展示。相比真分页(后端分页),假分页减少了与后端的交互次数,但可能带来性能问题(数据量过大时)。 核心实现…

vue实现分页教程

vue实现分页教程

Vue 分页实现方法 基础分页组件实现 创建一个简单的分页组件,包含页码按钮、上一页和下一页按钮。使用 v-for 循环生成页码,并通过 v-model 绑定当前页。 <template&g…

vue实现分页全选

vue实现分页全选

Vue 实现分页全选功能 分页全选功能通常用于表格或列表数据,允许用户跨页批量选择数据。以下是实现该功能的几种方法: 使用 Vuex 或 Pinia 管理选中状态 全局状态管理工具(如 Vuex 或…