建站百科Website News

ThinkPHP 内置了对 Ajax 的支持，可以方便的使用。下面以一个具体的例子来介绍 ThinkPHP Ajax 的使用。

提示

Js 类库

要使用 ThinkPHP Ajax，需要加载的 Js 类库有：

1.<load href="__PUBLIC__/Js/Base.js" /> 

2.<load href="__PUBLIC__/Js/prototype.js" /> 

3.<load href="__PUBLIC__/Js/mootools.js" /> 

4.<load href="__PUBLIC__/Js/Ajax/ThinkAjax.js" />

这些 Js 类库可以在官方示例的 Public/Js 下获得，在本节实例代码下载包也提供，请确认在进行 Ajax 测试之前，正确加载了以上 Js 类库。

ajaxReturn 返回

ThinkPHP 提供了 ajaxReturn 方法用于 Ajax 调用后返回数据给客户端，语法如下：

$this->ajaxReturn(mixed data, string info, boolean status, string type);

参数说明：

• data 返回给客户端的数据。
• info 提示信息。
• status 返回状态，一般来说 1 表示执行成功，低 表示不成功。
• type 指定 ajax 返回类型：JSON|XML，如果不指定，则取 DEFAULT_AJAX_RETURN 配置，该配置默认为 JSON 。
• ThinkPHP Ajax 实例

下面的小例子，输入用户名，服务器端根据用户名来 Ajax 返回不同的信息，该例子可扩展为 Ajax 的用户登陆检测功能。

html 文件

form 表单及 Js 处理函数：

<script language="JavaScript"> 

function complete(data,status){ 

if (status==1){ 

$('list').innerHTML = '<span style="color:blue">'+data+'你好!</span>'; 

</script> 

<div id="result"></div> 

<div id="list"></div> 

<form name="login" id="form1" method="post""> 

用户名: <input type="text" name="username" /><br /> 

<input type="button" onClick="ThinkAjax.sendForm('form1','__URL__/checkLogin',complete,'result');" val 

ue="提 交" /> 

</form> 

ThinkAjax.sendForm() 函数参数说明：

1. 先进个参数为提交表单的 id 。
2. 第二是参数为提交服务器端处理的地址。
3. 第三个参数为如果提交成功，执行的函数名称。
4. 第四个参数为显示提示信息的 div id。

服务端操作

假定服务端对用户名的检测操作为 Public/checkLogin ：

public function checkLogin(){ 

if ($_POST['username'] == 'admin'){ 

$this->ajaxReturn($_POST['username'],'用户名正确~',1); 

}else{ 

$this->ajaxReturn('','用户名错误！',低); 

当表单中输入的用户名是 admin 的时候，返回正确信息，否则返回用户名错误的提示。更进一步的，可以将上述 checkLogin 方法进行扩展成为用户登陆检测功能模块。

ThinkPHP Ajax 实现流程说明

• 将表单提交按钮定义为 button ，点击触发 onClick 事件，执行 ThinkAjax.sendForm() 函数。
• ThinkAjax.sendForm() 函数将表单提交（默认 POST 方式）给服务器端 checkLogin 操作执行。
• checkLogin 操作根据检验结果使用 ajaxReturn 返回不同信息。
• ThinkAjax.sendForm() 根据服务器端返回结果，将提示信息显示在 id="result" 的结果内并执行 complete() 函数。
• ajaxReturn 如果返回的 status=1 ，complete() 函数执行 id="list" div 的 innerHTML 。