Bootstrap php制作动态分页标签


Posted in Javascript onDecember 23, 2016

学习了下bootstrap,刚好在用分页,就自己写了一个分页,然后结合bootstrap样式展现。

bootstrap的分页格式:

<ul class="pagination">
  <li><a href="#">«</a></li>
  <li class="active"><a href="#">1</a></li>
  <li><a href="#">2</a></li>
  <li><a href="#">3</a></li>
  <li><a href="#">4</a></li>
  <li><a href="#">5</a></li>
  <li><a href="#">»</a></li>
</ul>

PHP动态分页过程;

/**
 * @param $maxpage 总页数
 * @param $page  当前页
 * @param string $para 翻页参数(不需要写$page),$para参数就应该设为'&id=1'
 * @return string 返回的输出分页html内容
 */
function multipage($maxpage, $page, $para = '') {
  $multipage = ''; //输出的分页内容
  $listnum = 5;   //同时显示的最多可点击页面

  if ($maxpage < 2) {
    return '';
  }else{
    $offset = 2;
    if ($maxpage <= $listnum) {
      $from = 1;
      $to = $maxpage;
    } else {
      $from = $page - $offset; //起始页
      $to = $from + $listnum - 1; //终止页
      if($from < 1) {
        $to = $page + 1 - $from;
        $from = 1;
        if($to - $from < $listnum) {
          $to = $listnum;
        }
      } elseif($to > $maxpage) {
        $from = $maxpage - $listnum + 1;
        $to = $maxpage;
      }
    }

    $multipage .= ($page - $offset > 1 && $maxpage >= $page ? '<li><a href="?page=1'.$para.'" >1...</a></li>' : '').
      ($page > 1 ? '<li><a href="?page='.($page - 1).$para.'" >«</a></li>' : '');

    for($i = $from; $i <= $to; $i++) {
      $multipage .= $i == $page ? '<li class="active"><a href="?page='.$i.$para.'" >'.$i.'</a></li>' :
   '<li><a href="?page='.$i.$para.'" >'.$i.'</a></li>';
    }

    $multipage .= ($page < $maxpage ? '<li><a href="?page='.($page + 1).$para.'" >»</a></li>' : '').
      ($to < $maxpage ? '<li><a href="?page='.$maxpage.$para.'" class="last" >...'.$maxpage.'</a></li>' : '');
    $multipage .= ' <li><a href="#" ><input type="text" size="3" onkeydown="if(event.keyCode==13) 
    {self.window.location=\'?page=\'+this.value+\''.$para.'\'; return false;}" ></a></li>';


    $multipage = $multipage ? '<ul class="pagination">'.$multipage.'</ul>' : '';
  }

  return $multipage;
}

输出分页结果,如$multipage = multipage(20,1);便可得到如下所示的分页标签了:

Bootstrap php制作动态分页标签

有个不完善的地方就是最后的页码自选择框的大小与bootstrap的分页框大小不一致,有点影响美观了。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jquery表单插件Autotab使用方法详解
Jun 24 Javascript
jquery实现拖动效果
Aug 10 Javascript
AngularJs Understanding the Model Component
Sep 02 Javascript
详解动画插件wow.js的使用方法
Sep 13 Javascript
Node中使用ES6语法的基础教程
Jan 05 Javascript
关于HTML5的data-*自定义属性的总结
May 05 Javascript
讲解vue-router之什么是动态路由
May 28 Javascript
vue指令只能输入正数并且只能输入一个小数点的方法
Jun 08 Javascript
vue 动态绑定背景图片的方法
Aug 10 Javascript
vue+node实现图片上传及预览的示例方法
Nov 22 Javascript
微信小程序 如何保持登录状态
Aug 16 Javascript
vue data恢复初始化数据的实现方法
Oct 31 Javascript
前端JS面试中常见的算法问题总结
Dec 23 #Javascript
Bootstrap源码解读导航条(7)
Dec 23 #Javascript
livereload工具实现前端可视化开发【推荐】
Dec 23 #Javascript
浅谈jQuery操作类数组的工具方法
Dec 23 #Javascript
jquery pagination插件动态分页实例(Bootstrap分页)
Dec 23 #Javascript
详解jQuery中的DOM操作
Dec 23 #Javascript
Bootstrap table两种分页示例
Dec 23 #Javascript
You might like
php列出mysql表所有行和列的方法
2015/03/13 PHP
如何使用PHP给图片加水印
2016/10/12 PHP
CCPry JS类库 代码
2009/10/30 Javascript
js各种验证文本框输入格式(正则表达式)
2010/10/22 Javascript
js有关元素内容操作小结
2011/12/20 Javascript
使用AngularJS来实现HTML页面嵌套的方法
2015/06/17 Javascript
JS对象是否拥有某属性如何判断
2017/02/03 Javascript
提高JavaScript执行效率的23个实用技巧
2017/03/01 Javascript
微信小程序 合法域名校验出错详解及解决办法
2017/03/09 Javascript
JS实现简单的选择题测评系统代码思路详解(demo)
2017/09/03 Javascript
移动前端图片压缩上传的实例
2017/12/06 Javascript
Angular使用cli生成自定义文件、组件的方法
2018/09/04 Javascript
Vue实现表格中对数据进行转换、处理的方法
2018/09/06 Javascript
详解vue后台系统登录态管理
2019/04/02 Javascript
详解将微信小程序接口Promise化并使用async函数
2019/08/05 Javascript
vue-form表单验证是否为空值的实例详解
2019/10/29 Javascript
基于vue hash模式微信分享#号的解决
2020/09/07 Javascript
如何使用原生Js实现随机点名详解
2021/01/06 Javascript
python用于url解码和中文解析的小脚本(python url decoder)
2013/08/11 Python
python单线程实现多个定时器示例
2014/03/30 Python
一个检测OpenSSL心脏出血漏洞的Python脚本分享
2014/04/10 Python
讲解Python中fileno()方法的使用
2015/05/24 Python
使用Python3编写抓取网页和只抓网页图片的脚本
2015/08/20 Python
利用python代码写的12306订票代码
2015/12/20 Python
用virtualenv建立多个Python独立虚拟开发环境
2017/07/06 Python
详解 Python 读写XML文件的实例
2017/08/02 Python
python 读取.csv文件数据到数组(矩阵)的实例讲解
2018/06/14 Python
浅谈python元素如何去重,去重后如何保持原来元素的顺序不变
2020/02/28 Python
Python实现自动签到脚本的示例代码
2020/08/19 Python
关于pycharm 切换 python3.9 报错 ‘HTMLParser‘ object has no attribute ‘unescape‘ 的问题
2020/11/24 Python
法国体育用品商店:GO Sport
2019/10/23 全球购物
如何利用cmp命令比较文件
2013/09/23 面试题
人力资源管理专业毕业生自荐书
2014/05/25 职场文书
百日宴上的祝酒词
2015/08/10 职场文书
分位数回归模型quantile regeression应用详解及示例教程
2021/11/02 Python
nginx配置限速限流基于内置模块
2022/05/02 Servers