You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

PHP/Bootstrap卡片分页优化:实现每页显示10张卡片

解决Bootstrap卡片分页每页仅显示2张的问题

针对分页显示异常的问题,只需对两处关键代码进行修改,即可实现每页最多显示10张卡片的需求:

1. 更新每页显示数量参数

找到分页逻辑中定义limitPerPage的位置,将其值从2改为10:

JavaScript端示例:

// 原代码
const limitPerPage = 2;
// 修改后
const limitPerPage = 10;

PHP端查询示例(后端分页场景):

// 原代码
$limitPerPage = 2;
// 修改后
$limitPerPage = 10;

2. 调整卡片分组判断条件

找到处理卡片分组/可见性的逻辑代码,将判断条件中的%2替换为%10:

// 原代码
if (visibleCards % 2 === 0) {
    // 卡片分组或分页切换逻辑
}
// 修改后
if (visibleCards % 10 === 0) {
    // 卡片分组或分页切换逻辑
}

修改完成后,测试分页控件的上一页、下一页及页码跳转功能,确认每页均能正确显示最多10张Bootstrap卡片即可。

内容的提问来源于stack exchange,提问作者Arthi Jaiswal

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.08.18 20:25:29