Thinkphp5框架ajax接口实现方法分析

本文实例讲述了Thinkphp5框架ajax接口实现方法。分享给大家供大家参考,具体如下:

前一篇讲到thinkphp5从数据库获取数据之后赋给视图view,前一篇从数据渲染方式来说是服务端数据渲染,这一章则是浏览器端数据渲染。按照知识总结依据来划分,这是两种不同的技术场景。

下面介绍具体的ajax接口实现代码。

首先是html代码部分,我的访问地址为:http://app.write.com/thinkphp/public/index.php/index/index/api,这里没有省略入口文件,同时我本地的域名是app.write.com,tp5框架在thinkphp文件里面。这里采用原生ajax,没有做ie浏览器的兼容性,代码如下

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>ajax调用接口</title>
</head>
<body>
  11111
  <div id="test">
  </div>
  <script type="text/javascript">
  var oAjax = new XMLHttpRequest();
  oAjax.open('GET',"/thinkphp/public/index.php/index/index/apiapi?name=1");
  oAjax.onreadystatechange = function() {
    if (oAjax.readyState == 4) {
      if (oAjax.status >= 200 && oAjax.status < 300 || oAjax.status == 304) {
        console.log(oAjax.responseText);
        var data=JSON.parse(oAjax.responseText);
        document.getElementById("test").innerHTML=data.sex;
      } else {
        console.log(oAjax.status);
      }
    }
  };
  oAjax.send();
  </script>
</body>
</html>

对上述代码做一下解释,算是一个小知识点:一般来说可以将http状态代码为200作为成功的标志,此时responseText的属性的内容已经就绪。此外状态304表示请求的资源并没有被修改,可以直接使用浏览器中缓存的版本。

至于为啥是大于200是出于兼容性的考虑,有的浏览器会报告204。

后端代码如下,后端代码是同一个模块index下的同一个控制器下index的apiapi方法。

<?php
namespace app\index\controller;
//use think\Db;
use think\Controller;
class Index extends Controller
{
   public function apiapi(){
    $name=$this->request->param();
    return json_encode($name);
    ///return "common";
  }
   public function api(){
    return view();
    ///return "common";
  }
}

代码首先获取ajax获取的参数,之后返回到前端。

更多关于thinkPHP相关内容感兴趣的读者可查看本站专题:《ThinkPHP入门教程》、《thinkPHP模板操作技巧总结》、《ThinkPHP常用方法总结》、《codeigniter入门教程》、《CI(CodeIgniter)框架进阶教程》、《Zend FrameWork框架入门教程》及《PHP模板技术总结》。

希望本文所述对大家基于ThinkPHP框架的PHP程序设计有所帮助。

(0)

相关推荐

  • ThinkPHP中使用ajax接收json数据的方法

    本文实例讲述了ThinkPHP中使用ajax接收json数据的方法.分享给大家供大家参考.具体分析如下: 这里通过ThinkPHP+jquery实现ajax,扩展了下,写了个查询,前台代码如下: 首先需要引入jquery.js,主要代码如下: 复制代码 代码如下: function ajax(id,pic){     //由于ThinkPHP不解析JavaScript里的ThinkPHP常量,所以需要先在这里定义. var URL='__URL__';         $.ajax({     

  • thinkPHP5框架实现基于ajax的分页功能示例

    本文实例讲述了thinkPHP5框架实现基于ajax的分页功能.分享给大家供大家参考,具体如下: 最近一个页面的选项卡又牵扯到ajax分页,所以研究了一下tp5的ajax分页使用方法 首先看一下tp5的分页功能介绍 参数 描述 list_rows 每页数量 page 当前页 path url路径 query url额外参数 fragment url锚点 var_page 分页变量 type 分页类名 $caseDetails = CaseDetails::where(['status'=>1])

  • TP5(thinkPHP5)框架基于ajax与后台数据交互操作简单示例

    本文实例讲述了TP5(thinkPHP5)框架基于ajax与后台数据交互操作.分享给大家供大家参考,具体如下: Ajax最大的一点是页面无刷新,在页面内与服务器通信,给用户的体验非常好.可以把以前一些服务器负担的工作转嫁到客户端,利用客户端闲置的能力来处理,减轻服务器和带宽的负担,节约空间和宽带租用成本.并且减轻服务器的负担,ajax的原则是"按需取数据",可以最大程度的减少冗余请求,和响应对服务器造成的负担. 最近在用tp5开发企业微应用,很有收获,觉得最需要注意的是thinkphp

  • ThinkPHP中ajax使用实例教程

    本文实例讲述了ThinkPHP中使用ajax的方法,提交表单如下图所示: 点击提交,不需要刷新本页,将内容提交到数据库当中,并在本页显示提交的内容.如下图所示: 一.jquery实现方法: MessageAction.class.php页面代码如下: <?php class MessageAction extends Action{ function index(){ $this->display(); } function add(){ //ajaxReturn(数据,'提示信息',状态)

  • thinkPHP5 ajax提交表单操作实例分析

    本文实例讲述了thinkPHP5 ajax提交表单操作.分享给大家供大家参考,具体如下: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script src="//cdn.bootcss.com/jquery/3.1.1/jquery.min.js"></script> <

  • ThinkPHP实现ajax仿官网搜索功能实例

    本文实例讲述了ThinkPHP实现ajax仿官网搜索功能的方法.分享给大家供大家参考. 具体实现方法如下: 后台代码: 复制代码 代码如下: //搜索,如果在1不在0  function search(){      $keyword = $_POST['search'];      $Goods=M('goods');    //这里我做的一个模糊查询到名字或者对应的id,主要目的因为我这个系统是    //商城系统里面用到直接看产品ID      $map['goods_id|goods_n

  • ThinkPHP通过AJAX返回JSON的两种实现方法

    本文实例讲述了ThinkPHP通过AJAX返回JSON的两种实现方法.分享给大家供大家参考.具体方法如下: 方法一: php代码如下: 复制代码 代码如下: $arr = array( 'name'=>$picname, 'pic'=>$pics, 'size'=>$size ); $this->ajaxReturn (json_encode($arr),'JSON'); JS部分代码如下: 复制代码 代码如下: var d=eval('('+d+')');//json转成obje

  • thinkphp中ajax与php响应过程详解

    本文实例分析了thinkphp中ajax与php响应过程.分享给大家供大家参考.具体分析如下: 一般将前台页面搜索结果中,不喜欢的内容(链接),删除掉,因为整个网站的编程框架式thinkphp,运用js中的ajax对页面进行响应,调用后台php接口,实现前台和后台数据库的同时更新. 首先我们需要做的就是在前台页面中添加一个文本"删除",可以这么添加: 复制代码 代码如下: <a href="javascript:void(0);" id= "<

  • ThinkPHP结合AjaxFileUploader实现无刷新文件上传的方法

    本文实例讲述了ThinkPHP结合AjaxFileUploader实现无刷新文件上传的方法.分享给大家供大家参考.具体实现方法分析如下: 首先,AjaxFileUploader插件是一个基于jquery的插件,我们可以使用AjaxFileUploader插件来实现文件异步上传功能了,使用这款插件上传文件不要担心兼容性的问题,它的兼容性可以说兼容所有主流浏览器,下面来给大家介绍一个AjaxFileUploader+thinkphp实现文件上传的实例. ThinkPHP框架下用AjaxFileUpl

  • 在Thinkphp中使用ajax实现无刷新分页的方法

    在Thinkphp目录的Lib\ORG\Util\目录里新建AjaxPage.class.php,写入一下内容: <?php // +---------------------------------------------------------------------- // | ThinkPHP [ WE CAN DO IT JUST THINK IT ] // +---------------------------------------------------------------

  • ThinkPHP处理Ajax返回的方法

    本文实例讲述了ThinkPHP处理Ajax返回的方法,分享给大家供大家参考.具体实现方法如下: 在ThinkPHP中可以直接使用ajax返回: 复制代码 代码如下: $.post(handleUrl,{username:username.val(),content:content.val()},function(data) { //这里是接收返回来的内容.},'json'); 而在处理过程中可以使用这个函数处理: 复制代码 代码如下: $this->ajaxReturn(要返回的内容,'json

  • ThinkPHP结合ajax、Mysql实现的客户端通信功能代码示例

    该实例通过ThinkPHP结合Ajax与mysql实现了客户端的通信功能,具体如下: 1.使用js的ajax局部刷新功能,每次刷新将数据库中读取出的新记录插入到页面的显示区域,代码如下: window.onload =setInterval(showWords1000);//加载完成之后开始执行刷新功能 function showWords()//刷新时被调用函数,实现ajax请求 { xmlHttp=GetXmlHttpObject();//从自定义的函数中获取请求对象. if (xmlHtt

随机推荐