O método a seguir é desenvolvido com base na estrutura THINKPHP5 para realizar a função de paginação do tipo botão da página anterior / próxima, conforme mostrado na figura abaixo: O
primeiro é uma paginação simples que não envolve a função de classificação.
Código do controlador
/*
*分页功能
* 参数:p 当前页码数
* listpage 每页显示的数据条数
* totalpage 总页数
* */
public function index(){
$p=input('p',1,'intval');//当前页码数,默认显示第一页
$listpage=input('listpage',8,'intval');//每页显示的数据条数
$count=Db::name('shujubiao')->count();//数据总数
$totalpage=ceil($count/$listpage);//总页数
$product=Db::name('shujubiao')->page($p,$listpage)->select();
$this->assign('product',$product);
$this->assign('p',$p);
$this->assign('totalpage',$totalpage);
return $this->view->fetch('页面');
}
Código de front-end, auto depuração de estilo
<div class="page-box mt50 box flex_b">
<input type="hidden" id="page" value="{$p}">
<input type="hidden" id="totalpage" value="{$totalpage}">
<a href="javascript:;" class="page-item up">上一页</a>
<a href="javascript:;" class="page-item down">下一页</a>
</div>
código js
//分页
//上一页
$(document).on('click', '.page-box .up', function() {
var page = $("#page").val();
page--;
if (page < 1) {
page = 1;
alert('已经是第一页了');
return false;
}
location.href = "/模块名/控制器名/方法名/p/" + page + '.html';//跳转到自己的控制器方法
});
//下一页
$(document).on('click', '.page-box .down', function() {
var page = $("#page").val();
var totalpage = $("#totalpage").val();
page++;
if (page > totalpage) {
page = totalpage;
alert('已经是最后一页了');
return false;
}
location.href = "/模块名/控制器名/方法名/p/" + page + '.html';//跳转到自己的控制器方法
});
O acima pode realizar funções simples da página anterior / próxima;
*
*
A função de paginação geralmente é combinada com a função de classificação. A seguir está o código de paginação com a função de classificação neste estilo.
Código do controlador (em comparação com a função de paginação normal acima, apenas a classificação em que a condição é adicionada)
public function index(){
//参数 class_id 分类id
$class_id=input('class_id','','intval');//参数@所属分类id
if(!$class_id){
//如果没有分类,显示全部商品
}else{
$classidarr=[];
$classidarr[0]=$class_id;
$classidarr=array_merge($classidarr,$this->loop($class_id));//所有下级分类id集合
$where['pclass_id']=array('in',$classidarr);//pclass_id为关联外键
}
//下面代码和普通分页代码基本一样,添加一个分类的where条件
$p=input('p',1,'intval');//当前页码数,默认显示第一页
$listpage=input('listpage',8,'intval');//每页显示的数据条数
$count=Db::name('shujubiao')->where($where)->count();//对应分类下的数据总数
$totalpage=ceil($count/$listpage);//总页数
$product=Db::name('shujubiao')->where($where)->page($p,$listpage)->select();
$this->assign('product',$product);
$this->assign('p',$p);
$this->assign('totalpage',$totalpage);
$this->assign('class_id',$class_id);//分类id
return $this->view->fetch('页面');
}
/*
* 获得所有下级分类id
* 参数:$pid 上级分类id
* */
private function loop($pid){
$idsarr=db('分类表')->where('pid',$pid)->column('id');
if($idsarr){
foreach($idsarr as $id){
$idsarr=array_merge($idsarr,$this->loop($id));
}
}
return $idsarr;
}
Código de front-end, auto-depuração de estilo (em comparação com o código html acima, a transferência de parâmetros classificados é adicionada)
<div class="page-box mt50 box flex_b">
<input type="hidden" id="page" value="{$p}">
<input type="hidden" id="totalpage" value="{$totalpage}">
<input type="hidden" id="class_id" value="{$class_id}">
<a href="javascript:;" class="page-item up">上一页</a>
<a href="javascript:;" class="page-item down">下一页</a>
</div>
código js (em comparação com o código js acima, julgamento de classificação e transferência de parâmetro são adicionados)
//分页
//上一页
$(document).on('click', '.page-box .up', function() {
var page = $("#page").val();
var classid = $("#class_id").val();
if (!classid) {
classid = 0;
}
page--;
if (page < 1) {
page = 1;
alert('已经是第一页了');
return false;
}
location.href = "/模块名/控制器名/方法名/p/" + page+ "/class_id/" + classid+ '.html';//跳转到自己的控制器方法
});
//下一页
$(document).on('click', '.page-box .down', function() {
var page = $("#page").val();
var totalpage = $("#totalpage").val();
var classid = $("#class_id").val();
if (!classid) {
classid = 0;
}
page++;
if (page > totalpage) {
page = totalpage;
alert('已经是最后一页了');
return false;
}
location.href = "/模块名/控制器名/方法名/p/" + page+ "/class_id/" + classid + '.html';//跳转到自己的控制器方法
});
O acima pode realizar a função de página anterior / próxima página combinada com a classificação.
O método de transmissão de parâmetros não é limitado e você pode modificar e depurar de acordo com seus próprios requisitos.