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

这里运用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 += "?" +new Date（）.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） {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：<?phpheader（"content-type:text/html;charset=utf-8"）;mysql_connect（"localhost","root","root"）;mysql_select_db（"db2"）;mysql_query（"set names utf8"）;$re=mysql_query（"select count（*） as num from catgory"）;$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 * 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技术实现无刷新分页，希望对大家有所帮助！