Ajax+smarty技术实现无刷新分页
这里运用Smarty模板，更简单
本文主要的技术：AJAX，PHP，Smarty,另外自己封装了一个很简单的类
类：
(function(){
function$(id){
returndocument.getElementById(id);
}
$.init=function(){
try{returnnewXMLHttpRequest();}catch(e){};
try{returnnewActiveXObject('Microsoft.XMLHTTP');}catch(e){}
alert('请更换浏览器');
}
$.get=function(url,data,callback,type){
varxhr=this.init();
url+='?'+newDate().getTime();
if(data!=null){
url+='&'+data;
}
xhr.open('get',url);
xhr.onreadystatechange=function(){
if(xhr.readyState==4&&xhr.status==200){
if(type==null){
callback(xhr.responseText);
}
if(type=='text'){
callback(xhr.responseText);
}
if(type=='xml'){
callback(xhr.responseXML);
}
if(type=='json'){
callback(eval("("+xhr.responseText+")"));
}
}
}
xhr.send(null);
}
$.post=function(url,data,callback,type){
varxhr=this.init();
xhr.open('post',url);
xhr.setRequestHeader('Content-Type','Application/x-www-form-urlencoded');
xhr.onreadystatechange=function(){
if(xhr.readyState==4&&xhr.status==200){
if(type==null){
callback(xhr.responseText);
}
if(type=='text'){
callback(xhr.responseText);
}
if(type=='xml'){
callback(xhr.responseXML);
}
if(type=='json'){
callback(eval("("+xhr.responseText+")"));
}
}
};
xhr.send(data);
}
类很简单，不介绍了
HTML:
window.onload=function(){
init(2);
}
functiondel(id,p){
$.get('del.php','id='+id,function(msg){
if(msg==1){
init(p);
}
})
}
functioninit(p){
$.get('page.php','page='+p,function(msg){
$('result').innerHTML=msg;
});
}
PHP：
<?php
header('content-type:text/html;charset=utf-8');
mysql_connect('localhost','root','root');
mysql_select_db('db2');
mysql_query('setnamesutf8');
$re=mysql_query('selectcount(*)asnumfromcatgory');
$hang=mysql_fetch_assoc($re);
$row1=$hang['num'];
$page=isset($_GET['page'])?$_GET['page']:1;
$pagesize=2;
$total=ceil($row1/$pagesize);
$prev=$page-1;
$next=$page+1;
if($prev<1){$prev=1;}
if($next>$total){$next=$total;}
$offset=($page-1)*$pagesize;
$result=mysql_query("select*fromcatgorylimit".$offset.','.$pagesize);
$ct=mysql_num_rows($result);
$data=array();
for($i=0;$i<$ct;$i++){
$r=mysql_fetch_assoc($result);
$data[]=$r;
}
include('libs/Smarty.class.php');
$Smarty=newSmarty();
$Smarty->assign('data',$data);
$Smarty->assign('page',$page);
$Smarty->assign('pagesize',$pagesize);
$Smarty->assign('total',$total);
$Smarty->assign('prev',$prev);
$Smarty->assign('next',$next);
$Smarty->assign('row1',$row1);
$str=$Smarty->fetch('page.html');
echo$str;
Smarty:
<tableborder="1"rules="all"width="600">
<tr>
<td>编号</td>
<td>品牌</td>
<td>pid</td>
<td>删除</td>
</tr>
{foreachfrom=$dataitem='value'}
<tr>
<td>{$value['id']}</td>
<td>{$value['name']}</td>
<td>{$value['pid']}</td>
<td><ahref="#",onclick="del({$value['id']},{$page})">删除</td>
</tr>
{/foreach}
<tr>
<tdcolspan="3">
共{$total}页
第{$page}页
<ahref="#",onclick="init({$prev})">上一页</a>
<ahref="#",onclick="init({$next})">下一页</a>
<ahref="#",onclick="init(1)">第一页</a>
<ahref="#",onclick="init({$total})">最末页</a>
共{$row1}条数据
每页{$pagesize}条数据
</td>
</tr>
</table>
要引入smary模板
以上所述是小编给大家介绍的Ajax+smarty技术实现无刷新分页，希望对大家有所帮助！