Ajax+smartyテクノロジーによるリフレッシュなしのページング

4015 ワード

ここでSmartyテンプレートを使うと、もっと簡単です.
本文の主な技術:AJAX,PHP,Smarty,それから自分で1つのとても簡単な種類を包装しました
クラス:

  (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:

$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;$iassign('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:

    
{foreach from=$data item='value'}
{/foreach}
番号付け
ブランド
pid
削除
{$value['id']}
{$value['name']}
{$value['pid']}
削除
合計{$total}ページ
ページ
前のページ
次のページ
第1ページ
最後のページ
合計{$row 1}エントリデータ
各ページ{$pagesize}エントリデータ
smaryテンプレートを導入するには
以上、編集者がご紹介したAjax+smartyテクノロジーのリフレッシュなしページ化を実現しましたので、お役に立てばと思います!