1）前台显示模板：
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Ajax 实现无刷新页面</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="__ROOT__/statics/js/jquery.js"></script> <!-- 载入 Ajax 类库 -->
<style type="text/css">
body {
font-size:12px;
}
</style>
</head>
<body>
<div id="fpage">数据加载中...</div>
</body>
</html>
<script type="text/javascript">
/**
* setPage(url) 根据 url 从 __URL__/ajax 中获取数据
* @param int pageNum 页码
* @return string
*/
var cache=new Array(); // 缓存变量，当数据被访问过之后放置在缓存中，加快访问速度
function setPage(pageNum) {
var fpage = document.getElementById(‘fpage‘); // 获取 fpage 对象
// 如果缓存中存在数据，那么直接从缓存中读取；如果不存在数据，那么就从数据库中读取，并把数据存入缓存
if (typeof(cache[pageNum])==‘undefined‘) {
/*var ajax = Ajax();
ajax.get("__URL__/ajax?page="+pageNum, function(data){
fpage.innerHTML = data; // fpage对象的内容是从 article.php 中取来的
cache[pageNum] = data;
})*/
$.ajax({
type:"GET",
url:"__URL__/ajax",
data:"page="+pageNum,
beforeSend:function(){
$(‘#fpage‘).html("正在努力加载中...");
},
success:function(data){
fpage.innerHTML = data; // fpage对象的内容是从 article.php 中取来的
cache[pageNum] = data;
}
});
} else {
fpage.innerHTML = cache[pageNum];
}
}
setPage(1); // 默认执行
</script>
2）后台控制器中的方法：
<?php
public function ajaxpage(){
$this->display(":ajaxpage");
}
public function ajax(){
sleep(2);
$m=M(‘article‘);
$page= new \Think\AjaxPage($m->count(),20);
$result=$m->limit("$page->limit")->select();
echo ‘<table align="center" border="1" width="1100" style="border-collapse:collapse;font-size:14px;" bordercolor="#666">‘;
echo ‘<caption><h1>资讯</h1></caption>‘;
echo ‘<tr height="25"><th>ID</th><th>Title</th><th>Author</th><th>Source</th><th>Date</th></tr>‘;
foreach ($result as $v) {
echo "<tr height=‘21‘><td align=‘center‘>{$v[‘id‘]}</td><td>{$v[‘title‘]}</td><td align=‘center‘>{$v[‘author‘]}</td><td align=‘center‘>{$v[‘source‘]}</td><td align=‘center‘>{$v[‘date‘]}</td></tr>";
}
echo ‘<tr><td align="right" colspan="5">‘.$page->fpage().‘</td></tr>‘;
echo ‘</table>‘;
}
3）ajax无刷新分页类：
<?php
namespace Think;
class ajaxPage {
private $total; //数据表中总记录数
private $listRows;//每页显示行数
private $limit;
private $uri;
private $pageNum; //页数
private $config=array(‘header‘=>"个记录", "prev"=>"上一页", "next"=>"下一页", "first"=>"首 页", "last"=>"尾 页");
private $listNum=8;
/*
* $total
* $listRows
*/
public function __construct($total, $listRows=10, $pa=""){
$this->total=$total;
$this->listRows=$listRows;
$this->uri=$this->getUri($pa);
$this->page=!empty($_GET["page"]) ? $_GET["page"] : 1;
$this->pageNum=ceil($this->total/$this->listRows);
$this->limit=$this->setLimit();
}
private function setLimit(){
return ($this->page-1)*$this->listRows.", {$this->listRows}";
}
private function getUri($pa){
$url=$_SERVER["REQUEST_URI"].(strpos($_SERVER["REQUEST_URI"], ‘?‘)?‘‘:"?").$pa;
$parse=parse_url($url);
if(isset($parse["query"])){
parse_str($parse[‘query‘],$params);
unset($params["page"]);
$url=$parse[‘path‘].‘?‘.http_build_query($params);
}
return $url;
}
private function __get($args){
if($args=="limit")
return $this->limit;
else
return null;
}
private function start(){
if($this->total==0)
return 0;
else
return ($this->page-1)*$this->listRows+1;
}
private function end(){
return min($this->page*$this->listRows,$this->total);
}
private function first(){
$html="";
if($this->page==1)
$html.=‘‘;
else
$html.=" <a href=‘javascript:setPage(1)‘>{$this->config["first"]}</a> ";
return $html;
}
private function prev(){
$html="";
if($this->page==1)
$html.=‘‘;
else
$html.=" <a href=‘javascript:setPage(". ($this->page-1) .")‘>{$this->config["prev"]}</a> ";
return $html;
}
private function pageList(){
$linkPage="";
$inum=floor($this->listNum/2);
for($i=$inum; $i>=1; $i--){
$page=$this->page-$i;
if($page<1)
continue;
$linkPage.=" <a href=‘javascript:setPage({$page})‘>{$page}</a> ";
}
$linkPage.=" {$this->page} ";
for($i=1; $i<=$inum; $i++){
$page=$this->page+$i;
if($page<=$this->pageNum)
$linkPage.=" <a href=‘javascript:setPage({$page})‘>{$page}</a> ";
else
break;
}
return $linkPage;
}
private function next(){
$html="";
if($this->page==$this->pageNum)
$html.=‘‘;
else
$html.=" <a href=‘javascript:setPage(". ($this->page+1) .")‘>{$this->config["next"]}</a> ";
return $html;
}
private function last(){
$html="";
if($this->page==$this->pageNum)
$html.=‘‘;
else
$html.=" <a href=‘javascript:setPage(". ($this->pageNum) .")‘>{$this->config["last"]}</a> ";
return $html;
}
private function goPage(){
return ‘ <input type="text" onkeydown="javascript:if(event.keyCode==13){var page=(this.value>‘.$this->pageNum.‘)?‘.$this->pageNum.‘:this.value;setPage(page)}" value="‘.$this->page.‘" style="width:25px"><input type="button" value="GO" onclick="javascript:var page=(this.previousSibling.value>‘.$this->pageNum.‘)?‘.$this->pageNum.‘:this.previousSibling.value;setPage(page)"> ‘;
}
function fpage($display=array(0,1,2,3,4,5,6,7,8)){
$html[0]=" 共有<b>{$this->total}</b>{$this->config["header"]} ";
$html[1]=" 每页显示<b>".($this->end()-$this->start()+1)."</b>条，本页<b>{$this->start()}-{$this->end()}</b>条 ";
$html[2]=" <b>{$this->page}/{$this->pageNum}</b>页 ";
$html[3]=$this->first();
$html[4]=$this->prev();
$html[5]=$this->pageList();
$html[6]=$this->next();
$html[7]=$this->last();
$html[8]=$this->goPage();
$fpage=‘‘;
foreach($display as $index){
$fpage.=$html[$index];
}
return $fpage;
}
}
AjaxPage.class.php
时间： 2024-10-12 14:21:56