整合Booststrap分页样式和ThinkPHP分页类

最新推荐文章于 2024-01-19 17:38:43 发布
最新推荐文章于 2024-01-19 17:38:43 发布
阅读量1.6w 收藏 2
点赞数 4
分类专栏： thinkphp


分页类修改内容：只涉及到样子生成部分代码，在原来每个A链接前加了li，在返回的样式字符串前加UL，以适合Boostrap的css文件的定义。

Bootstrap的css文件基本保持原状，只是加了一个#lastspan的样式定义。
--------------------------------------------------------------------------------

pagination.css

.pagination {
  margin: 20px 0;
}
.pagination ul {
  display: inline-block;
  list-style:none;
  *display: inline;
  /* IE7 inline-block hack */

  *zoom: 1;
  margin-left: 0;
  margin-bottom: 0;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -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 > a,
.pagination ul > li > span,
.pagination #lastspan {
  float: left;
  padding: 4px 12px;
  line-height: 20px;
  text-decoration: none;
  background-color: #ffffff;
  border: 1px solid #dddddd;
  border-left-width: 0;
}
.pagination ul > li > a:hover,
.pagination ul > li > a:focus,
.pagination ul > .active > a,
.pagination ul > .active > span {
  background-color: #f5f5f5;
}
.pagination ul > .active > a,
.pagination ul > .active > span {
  color: #999999;
  cursor: default;
}
.pagination ul > .disabled > span,
.pagination ul > .disabled > a,
.pagination ul > .disabled > a:hover,
.pagination ul > .disabled > a:focus {
  color: #999999;
  background-color: transparent;
  cursor: default;
}
.pagination ul > li:first-child > a,
.pagination ul > li:first-child > span {
  border-left-width: 1px;
  -webkit-border-top-left-radius: 4px;
  -moz-border-radius-topleft: 4px;
  border-top-left-radius: 4px;
  -webkit-border-bottom-left-radius: 4px;
  -moz-border-radius-bottomleft: 4px;
  border-bottom-left-radius: 4px;
}
.pagination ul > li:last-child > a,
.pagination ul > li:last-child > span,
.pagination #lastspan {
  -webkit-border-top-right-radius: 4px;
  -moz-border-radius-topright: 4px;
  border-top-right-radius: 4px;
  -webkit-border-bottom-right-radius: 4px;
  -moz-border-radius-bottomright: 4px;
  border-bottom-right-radius: 4px;
}
.pagination-centered {
  text-align: center;
}
.pagination-right {
  text-align: right;
}
.pagination-large ul > li > a,
.pagination-large ul > li > span,
.pagination-large #lastspan{
  padding: 11px 19px;
  font-size: 17.5px;
}
.pagination-large ul > li:first-child > a,
.pagination-large ul > li:first-child > span {
  -webkit-border-top-left-radius: 6px;
  -moz-border-radius-topleft: 6px;
  border-top-left-radius: 6px;
  -webkit-border-bottom-left-radius: 6px;
  -moz-border-radius-bottomleft: 6px;
  border-bottom-left-radius: 6px;
}
.pagination-large ul > li:last-child > a,
.pagination-large ul > li:last-child > span,
.pagination-large #lastspan {
  -webkit-border-top-right-radius: 6px;
  -moz-border-radius-topright: 6px;
  border-top-right-radius: 6px;
  -webkit-border-bottom-right-radius: 6px;
  -moz-border-radius-bottomright: 6px;
  border-bottom-right-radius: 6px;
}
.pagination-mini ul > li:first-child > a,
.pagination-small ul > li:first-child > a,
.pagination-mini ul > li:first-child > span,
.pagination-small ul > li:first-child > span {
  -webkit-border-top-left-radius: 3px;
  -moz-border-radius-topleft: 3px;
  border-top-left-radius: 3px;
  -webkit-border-bottom-left-radius: 3px;
  -moz-border-radius-bottomleft: 3px;
  border-bottom-left-radius: 3px;
}
.pagination-mini ul > li:last-child > a,
.pagination-small ul > li:last-child > a,
.pagination-mini ul > li:last-child > span,
.pagination-small ul > li:last-child > span {
  -webkit-border-top-right-radius: 3px;
  -moz-border-radius-topright: 3px;
  border-top-right-radius: 3px;
  -webkit-border-bottom-right-radius: 3px;
  -moz-border-radius-bottomright: 3px;
  border-bottom-right-radius: 3px;
}
.pagination-small ul > li > a,
.pagination-small ul > li > span {
  padding: 2px 10px;
  font-size: 11.9px;
}
.pagination-mini ul > li > a,
.pagination-mini ul > li > span {
  padding: 0 6px;
  font-size: 10.5px;
}

-------------------------------------------------------------------------------
Page.class.php 

<?php
// +----------------------------------------------------------------------
// | ThinkPHP [ WE CAN DO IT JUST THINK IT ]
// +----------------------------------------------------------------------
// | Copyright (c) 2009 http://thinkphp.cn All rights reserved.
// +----------------------------------------------------------------------
// | Licensed ( http://www.apache.org/licenses/LICENSE-2.0 )
// +----------------------------------------------------------------------
// | Author: liu21st <liu21st@gmail.com>
// |         lanfengye <zibin_5257@163.com>
// +----------------------------------------------------------------------
class Page {
    
    // 分页栏每页显示的页数
    public $rollPage = 5;
    // 页数跳转时要带的参数
    public $parameter  ;
    // 分页URL地址
    public $url     =   '';
    // 默认列表每页显示行数
    public $listRows = 20;
    // 起始行数
    public $firstRow    ;
    // 分页总页面数
    protected $totalPages  ;
    // 总行数
    protected $totalRows  ;
    // 当前页数
    protected $nowPage    ;
    // 分页的栏的总页数
    protected $coolPages   ;
    // 分页显示定制
    protected $config  =    array('header'=>'条记录','prev'=>'上一页','next'=>'下一页','first'=>'第一页','last'=>'<span id="lastspan">最后一页</span>','theme'=>'<ul><li><span> %totalRow% %header% %nowPage%/%totalPage% 页</span></li> %first%  %upPage% %prePage%  %linkPage% %downPage%  %nextPage% %end%</ul>');
    // 默认分页变量名
    protected $varPage;
    /**
     * 架构函数
     * @access public
     * @param array $totalRows  总的记录数
     * @param array $listRows  每页显示记录数
     * @param array $parameter  分页跳转的参数
     */
    public function __construct($totalRows,$listRows='',$parameter='',$url='') {
        $this->totalRows    =   $totalRows;
        $this->parameter    =   $parameter;
        $this->varPage      =   C('VAR_PAGE') ? C('VAR_PAGE') : 'p' ;
        if(!empty($listRows)) {
            $this->listRows =   intval($listRows);
        }
        $this->totalPages   =   ceil($this->totalRows/$this->listRows);     //总页数
        $this->coolPages    =   ceil($this->totalPages/$this->rollPage);
        $this->nowPage      =   !empty($_GET[$this->varPage])?intval($_GET[$this->varPage]):1;
        if($this->nowPage<1){
            $this->nowPage  =   1;
        }elseif(!empty($this->totalPages) && $this->nowPage>$this->totalPages) {
            $this->nowPage  =   $this->totalPages;
        }
        $this->firstRow     =   $this->listRows*($this->nowPage-1);
        if(!empty($url))    $this->url  =   $url; 
    }
    public function setConfig($name,$value) {
        if(isset($this->config[$name])) {
            $this->config[$name]    =   $value;
        }
    }
    /**
     * 分页显示输出
     * @access public
     */
    public function show() {
        if(0 == $this->totalRows) return '';
        $p              =   $this->varPage;
        $nowCoolPage    =   ceil($this->nowPage/$this->rollPage);
        // 分析分页参数
        if($this->url){
            $depr       =   C('URL_PATHINFO_DEPR');
            $url        =   rtrim(U('/'.$this->url,'',false),$depr).$depr.'__PAGE__';
        }else{
            if($this->parameter && is_string($this->parameter)) {
                parse_str($this->parameter,$parameter);
            }elseif(is_array($this->parameter)){
                $parameter      =   $this->parameter;
            }elseif(empty($this->parameter)){
                unset($_GET[C('VAR_URL_PARAMS')]);
                $var =  !empty($_POST)?$_POST:$_GET;
                if(empty($var)) {
                    $parameter  =   array();
                }else{
                    $parameter  =   $var;
                }
            }
            $parameter[$p]  =   '__PAGE__';
            $url            =   U('',$parameter);
        }
        //上下翻页字符串
        $upRow          =   $this->nowPage-1;
        $downRow        =   $this->nowPage+1;
        if ($upRow>0){
            $upPage     =    "<li><a href='".str_replace('__PAGE__',$upRow,$url)."'>".$this->config['prev']."</a></li>";
        }else{
            $upPage     =    '';
        }
        if ($downRow <= $this->totalPages){
            $downPage   =   "<li><a href='".str_replace('__PAGE__',$downRow,$url)."'>".$this->config['next']."</a></li>";
        }else{
            $downPage   =   '';
        }
        // << < > >>
        if($nowCoolPage == 1){
            $theFirst   =   '';
            $prePage    =   '';
        }else{
            $preRow     =   $this->nowPage-$this->rollPage;
            $prePage    =   "<li><a href='".str_replace('__PAGE__',$preRow,$url)."' >上".$this->rollPage."页</a></li>";
            $theFirst   =   "<li><a href='".str_replace('__PAGE__',1,$url)."' >".$this->config['first']."</a></li>";
        }
        if($nowCoolPage == $this->coolPages){
            $nextPage   =   '';
            $theEnd     =   '';
        }else{
            $nextRow    =   $this->nowPage+$this->rollPage;
            $theEndRow  =   $this->totalPages;
            $nextPage   =   "<li><a href='".str_replace('__PAGE__',$nextRow,$url)."' >下".$this->rollPage."页</a></li>";
            $theEnd     =   "<li><a href='".str_replace('__PAGE__',$theEndRow,$url)."' >".$this->config['last']."</a></li>";
        }
        // 1 2 3 4 5
        $linkPage = "";
        for($i=1;$i<=$this->rollPage;$i++){
            $page       =   ($nowCoolPage-1)*$this->rollPage+$i;
            if($page!=$this->nowPage){
                if($page<=$this->totalPages){
                    $linkPage .= "<li><a href='".str_replace('__PAGE__',$page,$url)."'>".$page."</a></li>";
                }else{
                    break;
                }
            }else{
                if($this->totalPages != 1){
                    $linkPage .= "<li><span class='current'>".$page."</span></li>";
                }
            }
        }
        $pageStr     =   str_replace(
            array('%header%','%nowPage%','%totalRow%','%totalPage%','%upPage%','%downPage%','%first%','%prePage%','%linkPage%','%nextPage%','%end%'),
            array($this->config['header'],$this->nowPage,$this->totalRows,$this->totalPages,$upPage,$downPage,$theFirst,$prePage,$linkPage,$nextPage,$theEnd),$this->config['theme']);
        return $pageStr;
    }
}

------------------------------------------------------------------------------
模板中使用：

<div class="pagination">{$page}</div> //基本样式
<div class="pagination pagination-large">{$page}</div>//大号数字样式


控制类代码：

$p = new Page ($count,10);   
		$products = $this->product_model->where($where)->order($order.' '.$method)->limit($p->firstRow.','.$p->listRows)->select();
        $page = $p->show ();   
			
        $this->assign( "page", $page );

更新日期：2017-9-23 ，修改了一些小问题

--------------------------------------------------------------------------

我的博客地址：http://blog.yiweibang.com/


宇凡网络
关注
  • 4
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 4
    评论
专栏目录
ThinkPHP 整合Bootstrap Ajax分页样式
12-19
ThinkPHP Ajax分页代码 publicfunction index() { $where=array(); $name = I('name'); if(!empty($name)){ $where['name']= array('like','%'.(string)$name.'%'); } $Role=M('Role'); $count= $Role->where($...
ThinkPHP3.2.3与bootstrp相结合优化分页记录
王定勇15993092872
07-16 464
开发是一项神圣的工作，既然选择了，就要做到尽善尽美。 今天发现一个很大的问题，就是我之前所使用的分页样式有点low，所以今天狠下心来要结合自己从未使用过的bootstrp来整合一个新的分页特效： bootstrp分页特效组件示例参考页面： https://v3.bootcss.com/components/#pagination 但是只看这些前端示例完全没有任何的进度，于是又在网上搜到了关...
bootstrap php分页类6,Thinkphp自带分页类样式转Bootstrap分页样式
weixin_36173545的博客
03-10 206
分享一段使用Thinkphp自带分页类样式转为Bootstrap分页样式的代码，首先我们看看效果图：无需改动tp的page类文件，只需把输出模板的html代码用我这个bootstrap_page_style函数替换即可变成Bootstrap分页样式注意：我使用的tp框架为3.2.3、Bootstrap 为 v3.3.0 版本，其他版本大同小异，可以根据这个函数自行修改！函数代码：/***Thin...
js实现翻页后保持checkbox选中状态的实现方法
jachinFang的博客
04-21 1494
这里主要实现一个页面有两个分页，实现勾选互不影响，提交数据 php后端--这里需要去了解一下display和fetch的区别去看手册吧 public function couponAdd(){ $this->display('couponAdd'); } public function product($model='product',$keyword='...
Bootstrap(前端开发框架)
m0_67294268的博客
04-30 707
一、Bootstrap是什么 1.诞生于2011年，来自Twitter公司，是目前最受欢迎的前端框架 2.是一个用于快速开发Web应用程序和网站的前端框架 佥测您的文章标题、错 3.Bootstrap是基于HTML、CSS、JS的，简洁灵活，使得Web开发更加快捷 概述：Bootstrap是一个建立一个页面，就可以在三个终端(PC端.平板、手机）上完美展示的响应式前端框架 二、Bootstrap的好处 1、响应式设计(Bootstrap的响应式CSS能够自适应台式机、平板电脑和手机） 2、.移动..
TP5中的分页样式（详细）
热门推荐
编程不过是一门失传艺术的别名，这门艺术的名字叫做“思考”
03-03 1万+
最近和tp5又打上交到了，前段时间使用它写接口，因此没有探究tp5和前端的联系及其便捷之处。最近做的项目前端后台联系较为紧密，因此将几个常用的点分享记录一下！ 最常用的应该就是分页了，tp5已经将分页给封装好了，实在是方便！分页主要在model中查询语句例使用paginate()函数。具体看官方文档，很简单易懂，这里不再说用处，下一篇我会将搜索+分页具体实例写出来供参考。tp5分页的默认样式很丑，或
thinkPHP5框架分页样式类完整示例
10-18
ThinkPHP5框架内置了分页类，可以让开发者更加方便地实现分页功能，同时支持自定义分页样式类，使得分页的界面和行为更加贴合项目需求。 在ThinkPHP5中，分页类一般定义在extend目录下的page.php文件中。自定义分页...
ThinkPHP分页类使用详解
10-26
2. **Page类实例化操作**：实例化Page类时，可以传递参数如每页记录数，以及设置其他分页样式和配置。 3. **limit函数**：限制SQL查询返回的数据量，与分页密切相关。 4. **show函数**：解析并显示分页内容，是3.1...
Thinkphp和Bootstrap结合打造个性的分页样式(推荐)
10-21
在本文中，我们了解到ThinkPHP3.1版本的分页样式存在一些不足，比如页码数字之间空隙小，不易点击，以及“前5页”和“后5页”的按钮显得多余。随着ThinkPHP5的出现，它开始对Bootstrap分页样式提供了完美支持。在...
thinkphp5分页样式
qmister
07-09 386
自带的分页类样式，有时不能满足项目的要求，这里主要介绍一下，分页类样式的定制和美化，使其更简洁、美观 thinkphp5控制器写法 functionindex($keyword='',$page=1){ $map=[]; if($keyword){ $map['code']=['like',"%{$keyword}%"]; } $list=Db('package')->whe...
ThinkPHP6 实现分页和分页样式
企业级技术与网站app运营
04-27 2505
原因是tp5在组装分页链接的时候，默认是组装bootstrap的分页样式链接，就是说，会自动加上class的属性。在模板视图文件中添加如下 CSS 代码：/* WAP 简洁分页 分页效果 - bootstrap 样式 start */在模板视图文件中添加如下 CSS 代码：/* 前台 完整分页 分页效果 - bootstrap 样式 start */经过测试，在 ThinkPHP6 的分页中遇到的分页样式不美观，尤其是搜索条件丢失的问题，得到完美解决。
【实战教程】ThinkPHP6分页功能轻松实现，让你的网站更高效！
最新发布
CRMEB小程序商城的博客
01-19 1276
通过上述步骤，我们成功地实现了ThinkPHP6的分页功能。相信通过本文的介绍，读者可以轻松地在自己的网站中添加分页功能，提高网站的用户体验。点此下载。
前端boostarp图标样式
zxcxixixi的博客
05-23 583
thinkphp分页样式
weixin_34290631的博客
02-18 86
html代码： <div class="pages">{$page}</div> 　　 css代码： .pages{ 　　width:100.5%; 　　text-align:right; 　　padding: 10px 0; 　　clear:both; } .pages a,.pages .current{ 　　font-si...
ThinkPHP5自定义分页样式
qq_25285531的博客
01-11 320
1.在thinkphp/library/think/paginator/driver目录下新建文件Page.php 注意命名空间和继承 <?php namespace think\paginator\driver; use think\Paginator; class Page extends Paginator { public $rollPage=5;//分页栏每页显示的页...
boostart栅格系统
MagicWing的博客
11-14 977
&lt;!--h5文档申明--&gt; &lt;!DOCTYPE html&gt; &lt;!--文档语言申明 en zh-CN zh-tw --&gt; &lt;html lang="zh-CN"&gt; &lt;head&gt; &lt;!--文档编码申明--&gt; &lt;meta charset="utf-8"&gt; &
ThinkPHP 6 模板篇之分页实现
json_li的博客
03-15 1573
ThinkPHP的内置分页已经封装好了， 直接通过paginate来获取分页很简单。如果样式不好看，可以自己设置一些样式来美化。
thinkphp5 自定义分页样式
skalpat的博客
02-22 4275
第一种 自定义分页类放到extra\page, <?php namespace page; // +---------------------------------------------------------------------- // | ThinkPHP [ WE CAN DO IT JUST THINK ] // +-------------------------...
ThinkPHP5分页样式
qq_36746815的博客
02-02 498
效果图: 1.在think\paginator\driver下新建一个类 Bootstrap_page (自己命名),然后加入以下代码(直接复制) &lt;?php namespace think\paginator\driver; use think\Paginator; class Bootstrap_page extends Paginator { //首页 ...
php控制分页数量,ThinkPHP5分页数量控制
06-06
在ThinkPHP5中，可以通过在控制器中设置每页数据条数来控制分页数量。具体步骤如下： 1. 在控制器中实例化分页类： ```php use think\facade\Db; use think\facade\Request; use think\paginator\driver\Bootstrap; class Index { public function index() { // 获取当前页数 $page = Request::param('page', 1); // 每页显示的数据条数 $pageSize = 10; // 查询数据 $list = Db::name('article')->paginate($pageSize); // 渲染模板 $paginator = new Bootstrap($list); return $this->fetch('index', ['list' => $list, 'paginator' => $paginator]); } } ``` 2. 在模板中使用分页： ```html <!-- 渲染分页 --> <div class="pagination"> {$paginator->render()} </div> ``` 在上述例子中，每页显示的数据条数通过 `$pageSize` 变量进行设置。如果需要修改每页显示的数据条数，只需要修改 `$pageSize` 变量的值即可。
评论 4
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值