jQuery实现无刷新分页

来源：互联网发布：手机视频录制软件ios 编辑：程序博客网时间：2024/04/28 22:04

HTML

<html><head><meta http-equiv="Content-Type" content="text/html;charset=UTF-8" /><script language='javascript' src='./js/jquery.js'></script><script type="text/javascript">/*** jQuery实现无刷新分页* */// 全局变量var num;// 初始化页码var cache = new Array();// 缓存数据// 分页function display(e){// alert(num);pageNum = e;var $fpage = $('#fpage');var data = {page : pageNum};if(cache[pageNum] == undefined){// 没有缓存实现ajax请求$.post('page.php', data, function(msg){$fpage.html(msg);cache[pageNum] = msg;});} else {// 有缓存直接读取缓存,减轻服务器压力$fpage.html(cache[pageNum]);}}// 控制器$(document).ready(function(){display(1);});</script></head><body><div id='fpage'>数据加载中...</div></body></html>

PHP

<?phprequire './config.inc.php';$db = MYDB :: getInstance($glob);$table = 'zzq_random';extract($_POST);// $page 是页码// 判断文件是否过期if(isset($html_file)){date_default_timezone_set('PRC');$file_time = date('Ymd', strtotime(filemtime($html_file)));} else {$file_time = OB_DIR.date('Ymd');if(!is_dir($file_time)){mkdir($file_time);}}// 分目录存放$html_file = $file_time.'/'.'page_'.$page.'.html';// 判断是否有缓存文件,如果有缓存文件执行缓存文件if(file_exists($html_file)){echo file_get_contents($html_file);exit;}// 没有缓存文件就执行下列语句$query = "SELECT count(*) as num FROM `$table`";$count = $db -> getOne($query);// 取得总条数$pageSize = 20;// 每页显示多少条$pageCount = ceil($count / $pageSize);// 总页数// 上一页$pageBefore = $page - 1;if($pageBefore < 1){$pageBefore = 1;}// 下一页$pageAfter = $page + 1;if($pageAfter > $pageCount){$pageAfter = $pageCount;}// 分页公式$offset = ($page - 1) * $pageSize;$query = "SELECT * FROM `$table` WHERE 1 LIMIT $offset,$pageSize";$result = $db -> getAll($query);//$result['data'] = $result;$str0 = "<table border='1' cellspacing='0' align='center'>";$str0.= "<tr>";$str0.= "<td>id</td>";$str0.= "<td>name</td>";$str0.= "<td>department_id</td>";$str0.= "</tr>";foreach($result as $k => $v){$str0.= "<tr>";$str0.= "<td>{$v['id']}</td>";$str0.= "<td>{$v['name']}</td>";$str0.= "<td>{$v['department_id']}</td>";$str0.= "</tr>";}$str0.= "</table><br />";$str0.= "<div align='center'><a href='javascript:viod(0)' onclick=display(" . 1 . ")>首页</a>";$str0.= "<a href='javascript:viod(0)' onclick=display(" . $pageBefore . ")>上一页</a>";for($i=0; $i<$pageCount; ++$i){$n = $i + 1;// 按钮颜色if($n == $page){$str0.= " <span style='cursor:pointer;width:20px;height:20px;background:#66ff99;'><a href='javascript:viod(0)'onclick=display(" . $n .  ")>$n</a></span> ";} else {$str0.= " <span style='cursor:pointer;width:20px;height:20px;background:#ffffff;'><a href='javascript:viod(0)'onclick=display(" . $n .  ")>$n</a></span> ";}}$str0.= "<a href='javascript:viod(0)' onclick=display(" . $pageAfter . ")>下一页</a>";$str0.= "<a href='javascript:viod(0)' onclick=display(" . $pageCount . ")>末页</a>";$str0.= "当前 {$page}页/共计{$pageCount}页</div>";// 开启ob缓存ob_start();echo $str0;$html_str = ob_get_contents();file_put_contents($html_file, $html_str);?>