网络编程 
首页 > 网络编程 > 浏览文章

Ajax+smarty技术实现无刷新分页

(编辑:jimmy 日期: 2024/11/28 浏览:3 次 )

这里运用Smarty模板,更简单

本文主要的技术:AJAX,PHP,Smarty,另外自己封装了一个很简单的类

类:

  (function(){
function $(id) {
return document.getElementById(id);
}
$.init=function() {
try{return new XMLHttpRequest();}catch(e){};
try{return new ActiveXObject('Microsoft.XMLHTTP');}catch(e){}
alert('请更换浏览器');
}
$.get=function (url,data,callback,type) {
var xhr = this.init();
url += '"("+xhr.responseText+")"));
}
}
}
xhr.send(null);
}

$.post = function (url,data,callback,type) {
var xhr = 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);
}
function del(id,p){
$.get('del.php','id='+id,function(msg){
if(msg==1){
init(p);
}
})
}
function init(p) {
$.get('page.php','page='+p,function(msg){
$('result').innerHTML=msg;
});
}

PHP:

<"select * from catgory limit ".$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=new Smarty();
$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:

    <table border="1" rules="all" width="600">
<tr>
<td>编号</td>
<td>品牌</td>
<td>pid</td>
<td>删除</td>
</tr>
{foreach from=$data item='value'}
<tr>
<td>{$value['id']}</td>
<td>{$value['name']}</td>
<td>{$value['pid']}</td>
<td><a href="#", onclick="del({$value['id']},{$page})">删除</td>
</tr>
{/foreach}
<tr>
<td colspan="3">
共{$total}页
第{$page}页
<a href="#", onclick="init({$prev})">上一页</a>
<a href="#", onclick="init({$next})">下一页</a>
<a href="#", onclick="init(1)">第一页</a>
<a href="#", onclick="init({$total})">最末页</a>
共{$row1}条数据
每页{$pagesize}条数据
</td>
</tr>
</table>

要引入smary模板

以上所述是小编给大家介绍的Ajax+smarty技术实现无刷新分页,希望对大家有所帮助!

上一篇:AJAX实现跨域的三种方法(代理,JSONP,XHR2)
下一篇:Ajax教程实例详解
一句话新闻
高通与谷歌联手!首款骁龙PC优化Chrome浏览器发布
高通和谷歌日前宣布,推出首次面向搭载骁龙的Windows PC的优化版Chrome浏览器。
在对骁龙X Elite参考设计的初步测试中,全新的Chrome浏览器在Speedometer 2.1基准测试中实现了显著的性能提升。
预计在2024年年中之前,搭载骁龙X Elite计算平台的PC将面世。该浏览器的提前问世,有助于骁龙PC问世就获得满血表现。
谷歌高级副总裁Hiroshi Lockheimer表示,此次与高通的合作将有助于确保Chrome用户在当前ARM兼容的PC上获得最佳的浏览体验。
友情链接:杰晶网络 DDR爱好者之家 南强小屋 黑松山资源网 白云城资源网 网站地图 SiteMap