El siguiente método se desarrolla en base al marco THINKPHP5 para realizar la función de paginación de estilo de botón de página anterior / siguiente, como se muestra en la figura siguiente: El
primero es una paginación simple que no involucra la función de clasificación.
Código del 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, estilo de autodepuración
<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';//跳转到自己的控制器方法
});
Lo anterior puede realizar funciones simples de página anterior / siguiente;
*
*
La función de paginación generalmente se mezcla con la función de clasificación A continuación se muestra el código de paginación con la función de clasificación en este estilo.
Código del controlador (en comparación con la función de paginación normal anterior, solo la clasificación donde se agrega la condición)
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, estilo de autodepuración (en comparación con el código html anterior, se agrega la transferencia de parámetros clasificados)
<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 (en comparación con el código js anterior, se agregan juicio de clasificación y transferencia de parámetros)
//分页
//上一页
$(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';//跳转到自己的控制器方法
});
Lo anterior puede realizar la función de página anterior / página siguiente combinada con clasificación.
El método de transmisión de parámetros no está limitado y puede modificar y depurar según sus propios requisitos.