前端需要dataTables插件:传送门下载地址
HTML代码
第一步引入插件
<!-- DataTables CSS --> <link type="text/css" href="https://cdn.datatables.net/1.10.15/css/jquery.dataTables.css" > <!-- jQuery --> <script type="text/javascript" charset="utf8" src="https://code.jquery.com/jquery-1.10.2.min.js"></script> <!-- DataTables --> <script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/1.10.15/js/jquery.dataTables.js"></script>
第二步添加
<table> <thead> <tr> <th>ID</th> <th>发布时间</th> <th>发布IP</th> <th>公告内容</th> </tr> </thead> <tbody> <volist> <tr> <td>{$vo.id}</td> <td>{$vo.create_time}</td> <td>{$vo.create_ip}</td> <td>{$vo.notice_content}</td> </tr> </volist> </tbody> </table>
第三步JS
<script> $(document).ready( function () { $('#table_id_example').DataTable(); } ); </script>
PHP代码
public function gonggaochakan(){ /* 公告查看 */ $dbNotice = M('notice');//实例化dbNotice对象 $count = $dbNotice->count();// 查询满足要求的总记录数 $Page = new \Think\Page($count,$count);// 实例化分页类 传入总记录数和每页显示的记录数(全部记录) $data = $dbNotice->order('create_time')->limit($Page->firstRow.','.$Page->listRows)->select();//获得所有记录 $this->assign('notice',$data);//传给模板 $this->show(); }
效果