thinkphp中ajax使用实例(thinkphp内置支持ajax)

thinkphp中ajax使用实例(thinkphp内置支持ajax)

一、总结

1、thinkphp应该是内置支持ajax的,所以请求类型里面才会有是否是ajax

// 是否为 Ajax 请求 if (Request::instance()->isAjax()) echo "当前为 Ajax 请求";

// 是否为 Pjax 请求 if (Request::instance()->isPjax()) echo "当前为 Pjax 请求"; 

二、thinkphp中ajax使用实例

  1 一、jquery实现方法:
  2 MessageAction.class.php页面代码如下:
  3 <?php
  4 class MessageAction extends Action{
  5   
  6  function index(){
  7   $this->display(); 
  8  }
  9   
 10  function add(){ //1、控制器add方法
 11   //ajaxReturn(数据,'提示信息',状态) 
 12   $m=M('message');
 13   if($m->add($_GET)){
 14    $this->ajaxReturn($_GET,'添加信息成功',1); //2、以ajax方式返回
 15   }else{
 16    $this->ajaxReturn(0,'添加信息失败',0); 
 17   }
 18  }
 19   
 20 }
 21 ?>
 22  
 23 模板index.html代码如下:
 24 <html>
 25 <head>
 26 <script type="text/javascript" src="__PUBLIC__/js/jquery-1.7.1.min.js"></script>
 27 <script type="text/javascript">
 28  $(function(){
 29   $('input:button').click(function(){  //1、表单ajax提交实例
 30    var $title=$('input[name="title"]').val();
 31    var $message=$('input[name="message"]').val();
 32    $mess=$('#mess');
 33    $.getJSON('__URL__/add',{title:$title,message:$message},function(json){ //2.提交到控制器中的add方法  3、$.getJSON感觉是封装的ajax的open方法
 34     //alert(json);return false;
 35     if(json.status==1){
 36      $mess.slideDown(3000,function(){
 37       $mess.css('display','block'); 
 38      }).html('标题为'+json.data.title+'信息为'+json.data.message); 
 39     }else{
 40      $mess.slideDown(3000,function(){
 41       $mess.css('display','block'); 
 42      }).html('信息添加失败,请检查'); 
 43     }  
 44    });
 45   }) 
 46  })
 47 </script>
 48 </head>
 49 <body>
 50 <div style="display:none; color:red;" id="mess"></div>
 51 <form action="" method="get">
 52  标题:<input type="text" name="title" /><br />
 53  信息:<input type="text" name="message" /><br />
 54   <input type="button" value="提交" />
 55 </form>
 56 </body>
 57 </html>
 58  
 59 二、ThinkPHP实现方法:
 60 MessageAction.class.php页面代码如下:
 61 <?php
 62 class MessageAction extends Action{
 63   
 64  function index(){
 65   $this->display(); 
 66  }
 67  
 68  function addtwo(){
 69   $m=M('message');
 70   if($vo=$m->create()){
 71    if($m->add()){
 72     $this->ajaxReturn($vo,'添加成功',1); 
 73    }else{
 74     $this->ajaxReturn(0,'添加失败',0); 
 75    } 
 76   }else{
 77    $this->error($m->getError()); 
 78   }
 79  }
 80 }
 81 ?>
 82  
 83 模板index.html代码如下:
 84 <html>
 85 <head>
 86 <script type="text/javascript" src="__PUBLIC__/Js/Base.js"></script>
 87 <script type="text/javascript" src="__PUBLIC__/Js/prototype.js"></script>
 88 <script type="text/javascript" src="__PUBLIC__/Js/mootools.js"></script>
 89 <script type="text/javascript" src="__PUBLIC__/Js/ThinkAjax.js"></script>
 90 <script type="text/javascript">
 91  function add(){
 92   //ThinkAjax.sendForm(表单ID,URL,回调函数,信息显示的地方);
 93   ThinkAjax.sendForm('frm','__URL__/addtwo',wc); 
 94  }
 95  function wc(data,status){
 96   if(status!=1){
 97    alert('发送失败');
 98   }else{
 99    $('list').innerHTML+='标题'+data.title+',信息'+data.message; 
100   } 
101  }
102 </script>
103  
104 </head>
105 <body>
106 <div id="list"></div>
107 <form action="" method="POST" id="frm">
108  标题:<input type="text" name="title" /><br />
109  信息:<input type="text" name="message" /><br />
110   <input type="button" value="提交" onClick="add()" />
111 </form>
112 </body>
113 </html>
114  
115 感兴趣的朋友可以测试运行一下本文所示实例,可以加深对Ajax应用的理解。
原文地址:https://www.cnblogs.com/Renyi-Fan/p/9083978.html