这一系列的博客,是为了理顺我在学php上的思路;感觉自己一直在写,但是却不知道写的是什么,一直跟着别人的思路在走,想要有自己的想法以及写代码的能力;为此,我决定将之前自己敲过的代码,整理一下,通过博客的形式来理顺自己的思路。
效果图如下,要实现的点有两个:1、点击查看详细信息 可以查看可以查看具体人员的详细信息
2、每页四条记录,实现效果是可以正常翻页
这个项目主要就是实现这两个方面的功能
实现步骤:
1、首先要有数据,还有数据的展示,暂时还没有跟数据库相连,所有数据只能通过前台来传,新建一个list.php页面
//以二维数组保存学生信息 $info=array( array('name'=>'王大壮','birth'=>'1996-08-07','subject'=>'PHP','snum'=>'0150427001'), array('name'=>'郭大印','birth'=>'1990-08-07','subject'=>'C#','snum'=>'0150427002'), array('name'=>'贾小娇','birth'=>'1992-07-29','subject'=>'PHP','snum'=>'0150427003'), array('name'=>'王小六','birth'=>'1995-05-04','subject'=>'C++','snum'=>'0150427004'), array('name'=>'宫大麟','birth'=>'1996-02-28','subject'=>'C++','snum'=>'0150427005'), array('name'=>'郭小斌','birth'=>'1986-11-22','subject'=>'PHP','snum'=>'0150427006'), );
以此二维数组的方式来添加数据,以下面的方式来显示数据;同时在点击查看详情那里,需要带上链接的地址,以传递的参数
<div>>>学生管理>>0427编程班>>学生信息列表</div> <table> <tr><td>学号</td><td>姓名</td><td>出生日期</td><td>详情</td></tr> <!-- 循环遍历将数据取出--> <?php for($i=0,$len=count($info);$i<$len;++$i){ ?> <tr> <td><?php echo $info[$i]['snum'] ?></td> <td><?php echo $info[$i]['name'] ?></td> <td><?php echo $info[$i]['birth'] ?></td> <td><a href="./detail.php?id=<?php echo $i;?>&page=<?php echo $page;?>">点击查看详情</a></td> </tr> <?php } ?> </table>
2、数据展示好了之后,应该做的是分页功能;页面的分页功能卸载 list.php页面中,单独的展示写在一个单独的函数里面,将其放在function.php中
//分页 ,这个是分页的功能,还需要有前台页面的支持 //总条数 每页显示数 当前页 总页面 $total_num = count($info); $perpage = 4; //每页显示4条 //先判断当前页是否存在,不存在就取1 $page = isset($_GET['page'])? (int)$_GET['page'] :1; //获取总页面,但是要注意,不一定是整数,所以要取整数 ceil函数可以实现 $total_page = ceil($total_num / $perpage ); //还要判断当前页是否小于1 或者是大于总页数 否则会有报错 $page = max($page,1); $page = min($page,$total_page); //分页需要遍历数据,需要知道每一页开始的索引值 第一页是 0123 第二页是 4567 $start_index=$perpage*($page-1); $end_index = $perpage*$page -1 ; //防止结果超过最大记录数,因为索引是从0开始的,所以最小值应该是总数-1 $end_index = min($end_index,$total_num-1);
function.php 中显示的showPage的功能函数,这个函数需要在list.php中调用,才会显示
function showPage($page,$total_page){ //拼接"首页"链接 $html = '<a href="?page=1">【首页】</a>'; //拼接“上一页”链接 $pre_page = $page - 1<= 0 ? $page :($page -1); $html.='<a href="?page='.$pre_page.'">【上一页】</a>'; //拼接“下一页”链接 注意判断 $next_page = $page + 1> $total_page ? $page :($page + 1); $html.='<a href="?page='.$next_page.'">【下一页】</a>'; //拼接“尾页”链接 $html.='<a href="?page='.$total_page.'">【尾页】</a>'; //返回拼接后的分页链接 return $html; }
调用代码如下:
<!-- 将分页页面展示出来 --> <div><?php echo showPage($page,$total_page);?></div>
问题来了,项目做到这,页面显示出来,但是问题是,我的代码控制每页只显示4条数据,为什么这是全部显示呢?我的猜测是在遍历数据的时候没有进行分页,定位到那段代码再去看看
在创建分页的时候,会为每一条数据创建索引,所以在遍历数据的时候,需要根据数据的索引值来遍历,也就是图中红框的内容需要修改
成功后的页面是这样的:
3、分页做好之后,就是点击查看详情 了;几个重点:(1)你需要知道每个人的信息,并获取 (2)将其展示出来,创建一个个性标签
修改源数据页面,将数据单独拿出来作为一个文件,以return 返回数据,通过数组来获取数据
//以二维数组保存学生信息 return array( 'info' => array( array('name'=>'王大壮','birth'=>'1996-08-07','subject'=>'PHP','snum'=>'0150427001'), array('name'=>'郭大印','birth'=>'1990-08-07','subject'=>'C#','snum'=>'0150427002'), array('name'=>'贾小娇','birth'=>'1992-07-29','subject'=>'PHP','snum'=>'0150427003'), array('name'=>'王小六','birth'=>'1995-05-04','subject'=>'C++','snum'=>'0150427004'), array('name'=>'宫大麟','birth'=>'1996-02-28','subject'=>'C++','snum'=>'0150427005'), array('name'=>'郭小斌','birth'=>'1986-11-22','subject'=>'PHP','snum'=>'0150427006'), ) );
详细数据页面的显示包含 姓名 学号 生日 年龄 星座还有个性标签
首先需要他们有一个容器可以显示出来,我的页面文件都是包含在php里面啦,这个是放在detail.php中,对于年龄的计算,星座的计算,通过两个函数来实现,这两个函数放在function.php页面中,个性标签的设置,可以放在当前页面中;另外还有部分数据处理,也放在了当前页面,当前页面是指 detail.php
年龄以及星座的功能函数
//年龄处理 function getAge($stu_by,$stu_bm,$stu_bd){ //获取当前日期 ynj 分别是年月日的代号 $cur_y = date('Y'); $cur_m = date('n'); $cur_d = date('j'); //年龄计算 $age = $cur_y - $stu_by ; //判断有没有过生日 if($cur_m < $stu_bm || $cur_m == $stu_bm && $cur_d < $stu_bd){ $age--; } return $age; } function getConst($stu_bm,$stu_bd){ if ($stu_bd<10){ $stu_bd = '0'.$stu_bd; //补0好计算,或者使用其他方法也可以 } //将月与日拼接 $date = "$stu_bm.$stu_bd"; //定义保存星座图片名称的变量 $lev = ''; if($date >=1.21 && $date <= 2.19){ $const = '水瓶座'; $lev = 1; }elseif($date >=2.20 && $date <= 3.20){ $const = '双鱼座'; $lev = 2; }elseif($date >=3.21 && $date <= 4.20){ $const = '白羊座'; $lev = 3; }elseif($date >=4.21 && $date <= 5.21){ $const = '金牛座'; $lev = 4; }elseif($date >=5.22 && $date <= 6.21){ $const = '双子座'; $lev = 5; }elseif($date >=6.22 && $date <= 7.22){ $const = '巨蟹座'; $lev = 6; }elseif($date >=7.23 && $date <= 8.23){ $const = '狮子座'; $lev = 7; }elseif($date >=8.24 && $date <= 9.23){ $const = '处女座'; $lev = 8; }elseif($date >=9.24 && $date <= 10.23){ $const = '天秤座'; $lev = 9; }elseif($date >=10.24 && $date <= 11.22){ $const = '天蝎座'; $lev = 10; }elseif($date >=11.23 && $date <= 12.21){ $const = '射手座'; $lev = 11; }else{ $const = '魔羯座'; $lev = 12; } return array($const,$lev); }
detail.php页面的调用
//调用自定义的函数,获取年龄 $age = getAge($stu_by,$stu_bm,$stu_bd); //获取学生星座,和星座代号 list($const,$lev) = getConst($stu_bm,$stu_bd);
到此,这个功能已经完成大半,还有一个个性标签,首先得定义,之后是调用
//定义学生个性标签 $label = '勇敢,低调,直率,执着,善良,乐活族,手机控,90后'; //分割学生个性标签 $labels = explode(',',$label);
同样下面的显示界面也需要修改,需要将其显示出来
<tr><td>星座:</td><td><?php echo $const;?> <img src="./images/<?php echo $lev.'.png';?>"> </td> </tr> <tr> <td>个性标签:</td> <td><?php foreach($labels as $v){ //定义数组保存标签块展示颜色 $class_name = array('blue','red','yellow','green'); $index = array_rand($class_name); //为每一个标签带有一个不一样的颜色 echo '<span class="'.$class_name[$index].'">'.$v.'</span>'; } ?> </td> </tr>
最后的效果就是,但是这样的图片并不美观
你们可以根据自己的需要添加css ,使它变得更漂亮一下,我会在下一篇博客上附上本篇的完整代码,感谢正在努力的自己。