ThinkAjax中异步传输技术实现代码

ThinkPHP的官方文档没有给出ThinkAjax的使用方法,令很多初学者使用起来有些不便,今天学到这里,也碰到了很多问题,花时间深究下,做个学习笔记,希望能对初学者有帮助。

代码如下:

1. <script type="text/javascript" src="__PUBLIC__/js/base.js">script> 
2. <script type="text/javascript" src="__PUBLIC__/js/prototype.js">script> 
3. <script type="text/javascript" src="__PUBLIC__/js/mootools.js">script> 
4. <script type="text/javascript" src="__PUBLIC__/js/Ajax/ThinkAjax.js">script> 
5. <script type="text/javascript"> 
6. function checktitle() 
7. { 
8.        ThinkAjax.send('__URL__/checktitle','ajax=1&title='+$('title').value,'','checkbox'); 
9. } 
10. script> 
11. <form action="__URL__/insert" method="post" id="myform"> 
12.  <table> 
13.      <tbody> 
14.      <tr> 
15.         <td width="45" class="tRight">标题：td> 
16.         <td> 
17.         <input type="text" id="title" name="title"> 
18.         <input type="button" value="检查" onClick="checktitle();">          
19.         td> 
20.         <td> 
21.         <span id="checkbox">span> 
22.         td> 
23.      tr>                  
24.       tbody> 
25.  table> 
26. form> 

代码解释:为“检查”按钮添加一个onclick事件,当按钮被点击时,调用checktitle()函数,在checktitle函数中,我们只用到了ThinkAjax对象中的成员方法send.

send:function(url,pars,response,target,tips,effect){……}

可以看出ThinkAjax.send方法共有6个参数：

参数url：表示要将客户端浏览器传输过来的数据提交到服务器上的哪个方法进行处理，我这里提交给“当前模块下的checktitle方法”处理

参数pars：相当于ajax中的send方法中的参数string，表示要提交过去的数据，该参数只用于post方式传值

参数response：自定义的回调函数，如果定义了回调函数，则服务器处理完提交过去的数据之后，将会把处理后的数据交给回调函数进行处理。该回调函数有两个参数：①data②status  参数data：将服务器端处理后的数据赋给data 参数status：表示处理后的状态信息，1表示成功 0 表示失败

参数target：表示将处理后的数据在哪个地方进行显示(或输出),比如:我将此参数赋为:checkbox,表示处理后的数据会在id=”checkbox”的标签进行信息输出.

当前模块下的checktitle方法的源代码如下:

2. class IndexAction extends Action 
3. { 
4.        // 首页 
5.        public function index(){ 
6.               $this->display(); 
7.        } 
8.        // 检查标题是否可用 
9.        public function checkTitle() 
10.        { 
11.               if(!emptyempty($_POST['title'])) 
12.                      { 
13.                      $Form     =     D("Form"); 
14.                      if($Form->getByTitle($_POST['title'])) 
15.                      { 
16.                             $this->error('标题已经存在'); 
17.                      } 
18.                      else 
19.                      { 
20.                             $this->success('标题可以使用!'); 
21.                      } 
22.               } 
23.               else 
24.               { 
25.                      $this->error('标题不能为空...'); 
26.               } 
27.        } 
28. } 
29. ?>