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 相关文章推荐
Javascript的时间戳和php的时间戳转换注意事项
Apr 12 Javascript
js中parseInt函数浅谈
Jul 31 Javascript
D3.js 从P元素的创建开始(显示可加载数据)
Oct 30 Javascript
Javascript实现商品秒杀倒计时(时间与服务器时间同步)
Sep 16 Javascript
基于Bootstrap的Metronic框架实现条码和二维码的生成及打印处理操作
Aug 29 Javascript
详解Vue 动态添加模板的几种方法
Apr 25 Javascript
vue-cli 引入jQuery,Bootstrap,popper的方法
Sep 03 jQuery
vue 项目 iOS WKWebView 加载
Apr 17 Javascript
基于layPage插件实现两种分页方式浅析
Jul 27 Javascript
three.js利用gpu选取物体并计算交点位置的方法示例
Nov 25 Javascript
JS实现悬浮球只在一侧滑动并且是横屏状态下
Aug 19 Javascript
vuex中遇到的坑,vuex数据改变,组件中页面不渲染操作
Nov 16 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
MVC模式的PHP实现
2006/10/09 PHP
PHP为表单获取的URL 地址预设 http 字符串函数代码
2010/05/26 PHP
php中的PHP_EOL换行符详细解析
2013/10/26 PHP
PHP根据图片色界在不同位置加水印的方法
2015/07/01 PHP
用javascript操作xml
2006/11/04 Javascript
让firefox支持IE的一些方法的javascript扩展函数代码
2010/01/02 Javascript
jquerymobile局部渲染的各种刷新方法小结
2014/03/05 Javascript
Javascript中的apply()方法浅析
2015/03/15 Javascript
jQuery删除一个元素后淡出效果展示删除过程的方法
2015/03/18 Javascript
js动态创建及移除div的方法
2015/06/03 Javascript
jquery中live()方法和bind()方法区别分析
2016/06/23 Javascript
使用jQuery实现页面定时弹出广告效果
2017/08/24 jQuery
动手写一个angular版本的Message组件的方法
2017/12/16 Javascript
javaScript中的空值和假值
2017/12/18 Javascript
对vue里函数的调用顺序介绍
2018/03/17 Javascript
对layui中table组件工具栏的使用详解
2019/09/19 Javascript
浅谈vue权限管理实现及流程
2020/04/23 Javascript
Vue组件生命周期运行原理解析
2020/11/25 Vue.js
[02:03]永远的信仰DOTA2 中国军团历届国际邀请赛回顾
2016/06/26 DOTA
利用Python脚本生成sitemap.xml的实现方法
2017/01/31 Python
python2与python3中关于对NaN类型数据的判断和转换方法
2018/10/30 Python
python itsdangerous模块的具体使用方法
2020/02/17 Python
Python使用pyexecjs代码案例解析
2020/07/13 Python
Kivari官网:在线购买波西米亚服装
2018/10/29 全球购物
俄罗斯卫浴采暖及维修用品超级市场:Dkrussia
2020/05/12 全球购物
老教师工作总结的自我评价
2013/09/27 职场文书
环保倡议书50字
2014/05/15 职场文书
商场开业庆典策划方案
2014/06/02 职场文书
动漫设计与制作专业推荐信
2014/07/07 职场文书
幼儿园秋季开学寄语
2014/08/02 职场文书
扶贫办主任查摆“四风”问题个人对照检查材料思想汇报
2014/10/02 职场文书
在职证明书模板
2015/06/15 职场文书
农村结婚典礼主持词
2015/06/29 职场文书
中学政教处工作总结
2015/08/13 职场文书
老舍《猫》教学反思
2016/02/17 职场文书
工厂无线对讲系统解决方案
2022/02/18 无线电