温馨提示×

温馨提示×

您好,登录后才能下订单哦!

密码登录×
登录注册×
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》

怎么在ThinkPHP中正确的使用ajax

发布时间:2020-12-18 15:44:37 来源:亿速云 阅读:157 作者:Leah 栏目:开发技术

本篇文章为大家展示了怎么在ThinkPHP中正确的使用ajax,内容简明扼要并且容易理解,绝对能使你眼前一亮,通过这篇文章的详细介绍希望你能有所收获。

一、jquery实现方法:

MessageAction.class.php页面代码如下:

<?php
class MessageAction extends Action{
 
 function index(){
  $this->display(); 
 }
 
 function add(){
  //ajaxReturn(数据,'提示信息',状态) 
  $m=M('message');
  if($m->add($_GET)){
   $this->ajaxReturn($_GET,'添加信息成功',1);
  }else{
   $this->ajaxReturn(0,'添加信息失败',0); 
  }
 }
 
}
?>

模板index.html代码如下:

<html>
<head>
<script type="text/javascript" src="__PUBLIC__/js/jquery-1.7.1.min.js"></script>
<script type="text/javascript">
 $(function(){
  $('input:button').click(function(){
   var $title=$('input[name="title"]').val();
   var $message=$('input[name="message"]').val();
   $mess=$('#mess');
   $.getJSON('__URL__/add',{title:$title,message:$message},function(json){
    //alert(json);return false;
    if(json.status==1){
     $mess.slideDown(3000,function(){
      $mess.css('display','block'); 
     }).html('标题为'+json.data.title+'信息为'+json.data.message); 
    }else{
     $mess.slideDown(3000,function(){
      $mess.css('display','block'); 
     }).html('信息添加失败,请检查'); 
    }  
   });
  }) 
 })
</script>
</head>
<body>
<div  id="mess"></div>
<form action="" method="get">
 标题:<input type="text" name="title" /><br />
 信息:<input type="text" name="message" /><br />
  <input type="button" value="提交" />
</form>
</body>
</html>

二、ThinkPHP实现方法:

MessageAction.class.php页面代码如下:

<?php
class MessageAction extends Action{
 
 function index(){
  $this->display(); 
 }

 function addtwo(){
  $m=M('message');
  if($vo=$m->create()){
   if($m->add()){
    $this->ajaxReturn($vo,'添加成功',1); 
   }else{
    $this->ajaxReturn(0,'添加失败',0); 
   } 
  }else{
   $this->error($m->getError()); 
  }
 }
}
?>

模板index.html代码如下:

<html>
<head>
<script type="text/javascript" src="__PUBLIC__/Js/Base.js"></script>
<script type="text/javascript" src="__PUBLIC__/Js/prototype.js"></script>
<script type="text/javascript" src="__PUBLIC__/Js/mootools.js"></script>
<script type="text/javascript" src="__PUBLIC__/Js/ThinkAjax.js"></script>
<script type="text/javascript">
 function add(){
  //ThinkAjax.sendForm(表单ID,URL,回调函数,信息显示的地方);
  ThinkAjax.sendForm('frm','__URL__/addtwo',wc); 
 }
 function wc(data,status){
  if(status!=1){
   alert('发送失败');
  }else{
   $('list').innerHTML+='标题'+data.title+',信息'+data.message; 
  } 
 }
</script>

</head>
<body>
<div id="list"></div>
<form action="" method="POST" id="frm">
 标题:<input type="text" name="title" /><br />
 信息:<input type="text" name="message" /><br />
  <input type="button" value="提交" onClick="add()" />
</form>
</body>
</html>

上述内容就是怎么在ThinkPHP中正确的使用ajax,你们学到知识或技能了吗?如果还想学到更多技能或者丰富自己的知识储备,欢迎关注亿速云行业资讯频道。

向AI问一下细节

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

AI