PHP与HTML实现数据的分页显示的页码具体实现分析_风云小虾米的博客-程序员宅基地_php分页页码动态的实现

技术标签: # HTML  

一、分页样式与结果

  分页的页码总共显示10个,如果需要分的页超过10个就将显示2~11,3~12…,15~24等依次类推,界面依旧显示10个可操作页码。

在这里插入图片描述

在这里插入图片描述
  具体的CSS样式,参考Bootstrap

https://v3.bootcss.com/components/

二、PHP函数分析

1、数据库查询操作函数分析

  为了方便编码时更加方便的进行逻辑性分析,将一些重复性的操作,写成函数,封装到另一个PHP文件中,此处的数据库查询操作将实现,在给定页码大小后,返回当前页码下应该显示的数据,数据的格式是数组格式。

//分页后的页面显示查询【操作数据库】
    function DataPageShow($PageNum){
    

        $skip=($PageNum-1)*10;#需要跳过的数据条数
        $link=mysqli_connect('localhost','root','','mysqltest');#连接数据库
        mysqli_set_charset($link,'utf8');#设置字符格式
        $sql="select * from sinanews limit {
      $skip},10";#编写MySQL执行语句
        $ExeResult=mysqli_query($link,$sql);#执行MySQL命令
        $DataResult=mysqli_fetch_all($ExeResult,MYSQLI_ASSOC);#获取执行结果
        mysqli_close($link);#关闭数据库
        return $DataResult;#返回查询到的数组格式数据

    }

2、数据表格显示函数分析

  从数据库查询的数据都是数组格式的,然后以表格方式来展现出来,所以此部分函数功能就是,给定具体要显示的数组格式数据,然后转换成HTML标签显示出来

//数据库内容以表格方式显示在页面
    function DataShow($ShowData){
    

        foreach($ShowData as $index => $val){
    
			//此处的if判断是为了让单数行与双数行的底色不一样方便观测,具体颜色可自定义
            if($index%2){
    
                $color='lightblue';
            }else{
    
                $color='yellow';
            }
            $IndexId=($index%10)+1;//设置页面表格显示的序列号
            $tim=date('Y-n-d H:i:s',$val['inputtime']);//将存储的时间戳,改为具体格式输出
            echo "
            <tr style='background:{
      $color}'>
                <th class='ids'>{
      $IndexId}</th>
                <th class='cur'>{
      $val['title']}</th>
                <th class='cur'>{
      $val['keywords']}</th>
                <th class='cur'>{
      $val['author']}</th>
                <th style='width:310px;height:80px;text-align:center;'>{
      $val['content']}</th>
                <th class='imag'><img src='{
      $val['image']}' style='zoom: 15%;'></img></th>
                <th class='cur'>{
      $tim}</th>
                <th class='cur'><a>修改</a>&nbsp;<a>删除</a></th>
            </tr>";
            //echo输出HTML标签,class=''是具体的样式
        }
    }

三、HTML部分的逻辑划分分析

1、分页类型判断

  分页的页码根据限制条件,总共显示10个页码,来分析,有两个大方向,一、数据量不足以分10个页码时;二、在数据量的分页超过10个页码时。

2、分页页码不足

  因为页码不足,所以页面显示的页码数,应该根据数据的具体条数来确定,具体代码如下:

 <?php
                $AllRows=DataRowNumber();#获取数据的所有行数
                $AllPages=ceil($AllRows/10);#计算需要设置的分页数
                if($AllPages<=10):
                    for($i=1;$i<=$AllPages;$i++):
            ?>
                <li><a href="./ShowNews.php?pages=<?= $i; ?>"><?= $i;?></a></li>  //这个部分为页码显示,用GET方法来传输,来获取当前的页码值
            <?php
                    endfor;
                endif;
                ?>

3、页码溢出

  在页面的页码数最大为10,当分页超过10个页码时,用滚动的方式来实现页码的显示如:13~22,具体的代码判断如下:

 <!-- 分页部分UI -->
        <table>
            <form action="#" method="GET" name='paging' >
            <nav aria-label="Page navigation">
            <ul class="pagination">
            <!-- 上一页 -->
            <li>
                <a href="./ShowNews.php?pages=<?= ($NowPages-1); ?>" aria-label="Previous">
                    <span aria-hidden="true">&laquo;</span>
                </a>
            </li>

            <?php
                $AllRows=DataRowNumber();#获取数据的所有行数
                $AllPages=ceil($AllRows/10);#计算需要设置的分页数
                if($AllPages<=10):
                    for($i=1;$i<=$AllPages;$i++):
            ?>
                <li><a href="./ShowNews.php?pages=<?= $i; ?>"><?= $i;?></a></li>
            <?php
                    endfor;
                endif;
                //页码超过10个时的判断
                if($AllPages>10):
                    for($j=1;$j<=10;$j++):
                        if($NowPages>10): //当前页码值超过10,代表目前页码数满足不了目前需求,所以,使用滚动页码
                            $key=$j+($NowPages-10);//实现页码变动
            ?>
                <li><a href="./ShowNews.php?pages=<?= $key; ?>"> <?= $key; ?> </a></li>
                <?php
                    endif;
                    if($NowPages<=10)://当前页码值没超过10,代表目前页码数满足目前需求,所以,使用固定页码
                ?>
                <li><a href="./ShowNews.php?pages=<?= $j; ?>"> <?= $j; ?> </a></li>
                <?php
                        endif;
                    endfor;
                endif;
                 ?>
            <!-- 下一页 -->
            <li>
                <a href="./ShowNews.php?pages=<?= ($NowPages+1); ?>" aria-label="Next">
                    <span aria-hidden="true">&raquo;</span>
                </a>
            </li>
            </ul>
            </nav>
            <form>
        </table>
版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/weixin_44839457/article/details/118973517

智能推荐

hdu 1059 Dividing 多重背包_弱菜zc的博客-程序员宅基地

题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=1059题意:有价值分别为1到6的六种弹珠,给出每种弹珠的数量。判断是否能将弹珠分成两份,使其价值相等。转换成多重背包问题。物品的代价等于物品的价值, 背包容量为总代价的一半。多重背包跑一遍后判读背包的最大价值是否等于总价值的一半。为什么可以这样做?因为物品的代价等于价值。若该状态下的最大价值

【Android 逆向】Android 进程注入工具开发 ( Visual Studio 开发 Android NDK 应用 | Visual Studio 中 SDK 和 NDK 安装位置 )_韩曙亮的博客-程序员宅基地

一、Visual Studio 中安装 " 使用 C++ 的移动开发 " 开发库、二、Visual Studio 中安装的 Android SDK 和 NDK 位置、三、Visual Studio 中安装的 NDK 头文件位置、四、Visual Studio 中查看 NDK 头文件

JBoss 系列二十七:JBoss Data Grid(Infinispan)下载安装和运行_ksoong的博客-程序员宅基地

安装Java安装Infinispan的先决条件只有一个就是Java虚拟机,Java 1.6或以后版本的Java需要安装在您的操作系统上。一个Java虚拟机(JVM)能够创建一个Java二进制码可以运行的虚拟环境,JVM创建这个标准的虚拟环境对底层的硬件和操作系统等是不考虑的,它运行程序员只编写Java代码一次而可以运行于其他任何操作系统。详细关于安装Java步骤参照系列一:软件安装和资料下载

MyEclipse项目上有红色感叹号_herbacin的博客-程序员宅基地_myeclipse项目红色感叹号

1,右键项目2,选择buildPath3,选择Configure Build Path4,选择Libraies5,看哪个包前面有红色感叹号,选择,点击remove

oracle在线日志出现错误 ORA-16038 ORA-19809 ORA-00312 错误解决_cite7656271的博客-程序员宅基地

现象: SQL&gt;conn/assysdbaConnectedtoanidleinstance.SQL&gt;SQL&gt;SQL&gt;startupORA...

Delph自定义皮肤(AlphaControls)_Anis_的博客-程序员宅基地

AlphaControls下载http://www.alphaskins.com/dwnld.php 这个链接可以下载最新的AlphaControls,还有几个版本下载,稳定版http://www.alphaskins.com/sfiles/stable/acnt_t.zip简洁版简洁版------------------------------------

随便推点

clamav 服务器_iteye_10553的博客-程序员宅基地

1、设置/etc/clamav/clamd.confAllowSupplementaryGroups trueUser myuser2、添加clamav到myuser组/etc/group3、设置chown -R myuser:myuser /var/log/clamav 现在的命令调用为clamdscan...

arm汇编和c混合编程_Clvan的博客-程序员宅基地

一、ARM在复位启动的时候,执行的是汇编指令ARM复位启动,首先执行汇编指令,完成一些硬件的基本初始化(stack、clock、DDR2 SDRAM、uart、cache、wdt、int、.....)。    然后在使用C来初始化:LCD、网卡、USB、加载操作系统并启动操作系统。ARM代码的编写过程:ARM汇编 ----> C语言不能C和汇编反复调用

WindowsX64 最新版JDK 6U23下载地址_qiaolevip的博客-程序员宅基地

<br />WindowsX64<br /><br />File Description and Name<br />Size<br /><br />Java SE Development Kit 6u23<br /> jdk-6u23-windows-x64.exe<br />66.92 MB

使用Amazon EBS作为EC2的数据盘_两个轮子的博客-程序员宅基地

在AWS的EC2上部署深度学习时,通常会有较大的数据集,动辄几个GB。为了避免每次启动EC2实例后再重新下载数据集,可以在终止实例前保存为自己的AMI,相当于将整个实例环境和数据备份,下一次从保存的AMI中启动实例,可以做到无缝对接。但是现在官方Deep Learning AMI最低启动容量上升到75GB,而0.1$/GB/month的价格实在有点肉疼,而且每次处理完都要保存本次AMI、删掉上...

ANDROID cmake版本下载,android studio中为gradle指定cmake版本_DarthP的博客-程序员宅基地

Android Studio相当于是Intellij基础上写了一个AS插件,这个插件使用gradle作为构建系统,因此构建出现问题先考虑gradle的文档。使用情景:我在系统中装了一个cmake3.13.4,发现android studio的sdk会去自行为ndk工程下载cmake3.6。我只想用cmake3.13.4。具体设置:方法1:/app/build.gradle:externalNati...

关于NO_ZERO_IN_DATE和ZERO_IN_DATE_yywzgh的博客-程序员宅基地_no_zero_date

1.建表CREATE TABLE `TEST_2` (  `ID` int(3) NOT NULL,  `NAME` varchar(45) DEFAULT NULL,  `VERSION` varchar(255) DEFAULT NULL,  `CREATE_TIME` date DEFAULT NULL) ENGINE=InnoDB DEFAULT CHARSET=utf8;...