tp自带分页类样式转Bootstrap分页样式

本文介绍如何将ThinkPHP框架的默认分页样式转换为Bootstrap风格。通过自定义函数bootstrap_page_style,可以轻松实现分页样式的转换,并提供具体代码示例。
效果图:


无需改动tp的page类文件,只需把输出模板的html代码用我这个bootstrap_page_style函数替换即可变成Bootstrap分页样式

注意:我使用的tp框架为3.2.3、Bootstrap 为 v3.3.0 版本,其他版本大同小异,可以根据这个函数自行修改!

函数代码:
  1. /**
  2.  * Thinkphp默认分页样式转Bootstrap分页样式
  3.  * @author H.W.H
  4.  * @param string $page_html tp默认输出的分页html代码
  5.  * @return string 新的分页html代码
  6.  */
  7. function bootstrap_page_style($page_html){
  8.     if ($page_html) {
  9.         $page_show = str_replace('<div>','<nav><ul class="pagination">',$page_html);
  10.         $page_show = str_replace('</div>','</ul></nav>',$page_show);

  11.         $page_show = str_replace('<span class="current">','<li class="active"><a>',$page_show);
  12.         $page_show = str_replace('</span>','</a></li>',$page_show);

  13.         $page_show = str_replace(array('<a class="num"','<a class="prev"','<a class="next"','<a class="end"','<a class="first"'),'<li><a',$page_show);
  14.         $page_show = str_replace('</a>','</a></li>',$page_show);
  15.     }
  16.     return $page_show;
  17. }
复制代码
css代码
  1. .hwh-page-info a{color: #CCC;}.hwh-page-info a em{font-style: normal;margin: 0 2px;}
复制代码
使用实例代码:
  1. $Page->lastSuffix = false;//最后一页不显示为总页数
  2.         $Page->setConfig('header','<li class="disabled hwh-page-info"><a>共<em>%TOTAL_ROW%</em>条  <em>%NOW_PAGE%</em>/%TOTAL_PAGE%页</a></li>');
  3.         $Page->setConfig('prev','上一页');
  4.         $Page->setConfig('next','下一页');
  5.         $Page->setConfig('last','末页');
  6.         $Page->setConfig('first','首页');
  7.         $Page->setConfig('theme','%HEADER% %FIRST% %UP_PAGE% %LINK_PAGE% %DOWN_PAGE% %END%');
  8. $page_show = bootstrap_page_style($Page->show());//重点在这里
  9. $this->assign('page_show'=>$page_show);



http://www.thinkphp.cn/extend/884.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值