<?php
/*****************************************
Title :Smarty结合Ajax留言板实例
Author:leehui1983(辉老大)
Page Name:index.php
Finish Date :2006-12-17
*****************************************/
require('./libs/Smarty.class.php');//包含smarty类库
require('./inc/dbclass.php');//包含数据库操作类
$db = new db();//生成数据库操作实例
$smarty = new Smarty();//实例化smarty对象
$smarty->template_dir = "./templates";//设置模板目录
$smarty->compile_dir = "./templates_c"; //设置编译目录
$smarty->caching = false; //设置缓存方式
/*****************************************************
左右边界符，默认为{}，但实际应用当中容易与JavaScript
相冲突，所以建议设成<{}>或其它。
*****************************************************/
$smarty->left_delimiter = "<{";
$smarty->right_delimiter = "}>";
$smarty->assign('title','smarty结合ajax制作简单留言板');//替换模板内容
//设置初始页面由Smarty显示的留言内容
$rt=$db->query("select * from bookinfo order by id desc");
while($rs=$db->loop_query($rt)){
$array[]=array("username"=>$rs['username'],"comment"=>$rs['comment']);
}
$smarty->assign("bookinfo",$array);
unset ($array);//销毁数组变量
$smarty->display("index.tpl");//编译并显示位于./templates下的index.tpl模板
?>
页面实例的注释还是比较多的，大家参考下Smarty手册这个是So easy的！！呵呵～～～～
接下来到了介绍ajax的时候，这里我们用一个基本的开发框架来实现，关于ajax的知识建议大家看看网上非常流行的电子教程ajax开发简略
var http_request=false;
function send_request(url){//初始化，指定处理函数，发送请求的函数
http_request=false;
//开始初始化XMLHttpRequest对象
if(window.XMLHttpRequest){//Mozilla浏览器
http_request=new XMLHttpRequest();
if(http_request.overrideMimeType){//设置MIME类别
http_request.overrideMimeType("text/xml");
}
}
else if(window.ActiveXObject){//IE浏览器
try{
http_request=new ActiveXObject("Msxml2.XMLHttp");
}catch(e){
try{
http_request=new ActiveXobject("Microsoft.XMLHttp");
}catch(e){}
}
}
if(!http_request){//异常，创建对象实例失败
window.alert("创建XMLHttp对象失败！");
return false;
}
http_request.onreadystatechange=processrequest;
//确定发送请求方式，URL，及是否同步执行下段代码
http_request.open("GET",url,true);
http_request.send(null);
}
//处理返回信息的函数
function processrequest(){
if(http_request.readyState==4){//判断对象状态
if(http_request.status==200){//信息已成功返回，开始处理信息
document.getElementById(reobj).innerHTML=http_request.responseText;
}
else{//页面不正常
alert("您所请求的页面不正常！");
}
}
}
function send(obj){
var f=document.book;
var username=f.username.value;
var comment=f.comment.value;
if(username==""||comment==""){
document.getElementById(obj).innerHTML="<font color=red>请填写完整！</font>";
return false;
}
else{
send_request('checkbookinfo.php?username='+username+'&comment='+comment);
reobj=obj;
}
}
这样我们点“发布”按钮，数据就会交由服务器异步处理，通过JS来组织异步更新，在发过留言后你马上就能看见你的留言而不是传统的等待页面跳转，那么数据传到哪里处理呢？看这里：
<?php
/*****************************************
Title :Smarty结合Ajax留言板实例
Author:leehui1983(辉老大)
Page Name:checkbookinfo.php
Finish Date :2006-12-17
*****************************************/
header("Content-type: text/html;charset=GBK");//输出编码,避免中文乱码
include('./inc/dbclass.php');//包含数据库操作类
$db=new db();//生成数据库操作实例
$sql="insert into bookinfo values(0,'".$comment."','".$username."')";
$db->query($sql);
$querysql="select * from bookinfo order by id desc";
$result=$db->query($querysql);
while($rows=$db->loop_query($result)){//打印留言列表，用于实时更新
//$arr.="用户名：{$rows['username']} 内容：{$rows['comment']}<p>";
echo '用户名：'.$rows['username'].' 内容：'.$rows['comment'].'<p>';
}
//echo $arr;
?>
嗯，先插入数据，在将更新后的数据通过JS组织显示，AJAX看来真的不错哦！大体就介绍完了，不知道大家想过没有，加个 iframe可以改成什么?对！无刷新聊天室，发挥你的能力，实现一个看看。这个例子用到了OO，AJAX，SMARTY，东西还是蛮多滴，希望大家喜欢，我已经决定将此文向PHP杂志投稿，大家若是转载，还希望注明版权，谢谢！最后来个效果图～～～～
您可能感兴趣的文章: