PHP实现分页功能(一)上一页/下一页(含有分类功能的分页)

以下方法是基于THINKPHP5框架开发,实现上一页/下一页按钮式的分页功能,如下图
在这里插入图片描述
首先是简单的不涉及分类功能的分页

控制器代码

/*
 *分页功能
 * 参数: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('页面');
}

前端代码,样式自行调试

<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>

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';//跳转到自己的控制器方法
});

以上就可以实现简单的上一页/下一页功能;
*
*

分页功能通常会参杂分类功能,下面是此种样式下含有分类功能的分页代码。

控制器代码(和上面普通分页功能相比,只是添加了分类where条件)

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;
}

前端代码,样式自行调试(和上面html代码相比,添加了分类参数的传递)

<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>

js代码(和上面js代码相比,添加了分类判断及参数传递)

//分页
//上一页
$(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';//跳转到自己的控制器方法
});

以上就可以实现与分类结合的上一页/下一页功能。
参数的传递方法不限,可根据自己要求进行修改调试。

  • 0
    点赞
  • 15
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值