TP3.2.3框架分页以及样式

本文介绍TP框架中分页功能的实现方法,包括封装公共函数、控制器中的分页调用及视图展示,并提供样式定制。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

 

TP3.2.3框架分页以及样式

TP框架自带分页的实现方法,所以使用这个分页方案

1,先看做好的效果图

 

没有显示共多少页,那个效果可以在自己封装好的方法里面改。

2,首先就是去封装一个公共函数

 

   /**
     * TODO 基础分页的相同代码封装,使前台的代码更少
     * @param $m 模型,引用传递
     * @param $where 查询条件
     * @param int $pagesize 每页查询条数
     * @return \Think\Page
     */
    public static function getpage(&$m,$pagesize,$count){
        $m1=clone $m;//浅复制一个模型
//$count = $m->where($where)->count();//连惯操作后会对join等操作进行重置 (因为我没有用到共有多少页的展示,所以就注释掉了,可以根据自己的需求来定) 

$m=$m1;//为保持在为定的连惯操作,浅复制一个模型 $p=new Think\Page($count,$pagesize); $p->lastSuffix=false;
//因为我没有用到这块,所以可根据自己的需求更改 //
$p->setConfig(‘header‘,‘<li class="rows">共<b>%TOTAL_ROW%</b>条记录&nbsp;&nbsp;每页<b>%LIST_ROW%</b>条&nbsp;&nbsp;第<b>%NOW_PAGE%</b>页/共<b>%TOTAL_PAGE%</b>页</li>‘); $p->setConfig(‘prev‘,‘上一页‘); $p->setConfig(‘next‘,‘下一页‘); $p->setConfig(‘last‘,‘末页‘); $p->setConfig(‘first‘,‘首页‘); $p->setConfig(‘theme‘,‘%FIRST% %UP_PAGE% %LINK_PAGE% %DOWN_PAGE% %END% %HEADER%‘); $p->parameter=I(‘get.‘); $m->limit($p->firstRow,$p->listRows); return $p; } getpage方法可以放在TP框架的 Application/Home/Common/function.php,这个文档可以专门放置一些通用的方法,在哪里都可以调用(如:Controller文件,View文件等)。

 

3,在控制器方法里面调用分页的方法

 

$m=M('products');
$count = $m->where(array('s_states' => '1'))->count();
$p=getpage($m,10,$count);
$list=$m->field(true)->where($where)->order('id desc')->select();
$show = $p->show();
$this->assign('list',$list);
$this->assign('page',$show);
$this->display();

4,view页面上的代码

 

 

<div class="pagination">
      <ul>
            <li>{$page}</li>
        </ul>
</div>

5,页面显示的样式

 

 

.pagination ul {
    display: inline-block;
    margin-bottom: 0;
    margin-left: 0;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    -webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.05);
    -moz-box-shadow: 0 1px 2px rgba(0,0,0,0.05);
    box-shadow: 0 1px 2px rgba(0,0,0,0.05);
}
.pagination ul li {
  display: inline;
}

.pagination ul li.rows {
    line-height: 30px;
    padding-left: 5px;
}
.pagination ul li.rows b{color: #f00}

.pagination ul li a, .pagination ul li span {
    float: left;
    padding: 4px 12px;
    line-height: 20px;
    text-decoration: none;
    background-color: #fff;
    background: url('../images/bottom_bg.png') 0px 0px;
    border: 1px solid #d3dbde;
    /*border-left-width: 0;*/
    margin-left: 2px;
    color: #08c;
}
.pagination ul li a:hover{
    color: red;
    background: #0088cc;
}
.pagination ul li.first-child a, .pagination ul li.first-child span {
    border-left-width: 1px;
    -webkit-border-bottom-left-radius: 3px;
    border-bottom-left-radius: 3px;
    -webkit-border-top-left-radius: 3px;
    border-top-left-radius: 3px;
    -moz-border-radius-bottomleft: 3px;
    -moz-border-radius-topleft: 3px;
}
.pagination ul .disabled span, .pagination ul .disabled a, .pagination ul .disabled a:hover {
color: #999;
cursor: default;
background-color: transparent;
}
.pagination ul .active a, .pagination ul .active span {
color: #999;
cursor: default;
}
.pagination ul li a:hover, .pagination ul .active a, .pagination ul .active span {
background-color: #f0c040;
}
.pagination ul li.last-child a, .pagination ul li.last-child span {
    -webkit-border-top-right-radius: 3px;
    border-top-right-radius: 3px;
    -webkit-border-bottom-right-radius: 3px;
    border-bottom-right-radius: 3px;
    -moz-border-radius-topright: 3px;
    -moz-border-radius-bottomright: 3px;
}

.pagination ul li.current a{color: #f00 ;font-weight: bold; background: #ddd}

注意:如果你最后结果返回出来的是源码的话,就要修改成

 

 

$p->setConfig('theme','%first% %upPage% %linkPage% %downPage% %end% ');

也就是把上面的大写的地方换成小写的字母,就大功告成啦。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值