第七城市th7cn
摘要：ThinkPHP是一个小型网站很常用的低端框架，但是不专业的文档和编码导致使用者很容易只知其表不知其里。这里仅就官方文档中未曾提及的在thinkphp中使用jquery实现ajax异步交互略作总结。
环境：ThinkPHP3.2.3，jQuery
阅读目录：
正文：
在一般的网站中，都需要用到jquery或者其他框架（比如angular）来处理前后端数据交互。在thinkphp在后台也内置了一些函数用于数据交互（比如ajaxReturn()）。本文的目的是打通jquery ajax到thinkphp的前后端数据交互过程。
前言：
一、thinkphp关于ajax的介绍
1.1 ajaxReturn：
/Think/Controller类提供了ajaxReturn方法用于AJAX调用后返回数据给客户端（视图、模板、js等）。并且支持JSON、JSONP、XML和EVAL四种方式给客户端接受数据（默认JSON）。（链接：#ajax_return）
配置方式：convention.php中定义了默认编码类型为DEFAULT_AJAX_RETURN => 'JSON',
分析：ajaxReturn()调用了json_encode()将数值转换成json数据存储格式，常用的数值是数组。
注意：The value being encoded can be any type except a resource(资源文件).All string data must be UTF-8 encoded.（链接：）
举例：
$data['status'] = 1;
$data['content'] = 'content';
$this->ajaxReturn($data);
1.2 请求类型：
系统内置了一些常量用于判断请求类型，比如：
常量 说明
IS_GET 判断是否是GET方式提交
IS_POST 判断是否是POST方式提交
IS_PUT 判断是否是PUT方式提交
IS_DELETE 判断是否是DELETE方式提交
IS_AJAX 判断是否是AJAX提交
REQUEST_METHOD 当前提交类型
目的：一方面可以针对请求类型作出不同的逻辑处理，另外一方面可以过滤不安全的请求。 （链接：#request_method）
使用方法：
class UserController extends Controller{
public function update(){
if (IS_POST){
$User = M('User');
$User->create();
$User->save();
$this->success('保存完成');
}else{
$this->error('非法请求');
}
}
}
1.3 跳转和重定向：
功能比较鸡肋，在ajax异步交互局部刷新中，不需要有文字提示的跳转。（链接：#page_jump_redirect）
二、jQuery Ajax的介绍：
2.1 官网关于jQuery.ajax()的介绍：
jQuery.ajax() 方法用于执行 AJAX（异步 HTTP）请求。（链接：）
语法：$.ajax({name:value, name:value, ... })，该参数规定 AJAX 请求的一个或多个名称/值对。
常见参数：
type (默认: 'GET')
类型: String
请求方式 ("POST" 或 "GET")， 默认为 "GET"。注意:其它 HTTP 请求方法，如 PUT 和 DELETE 也可以使用，但仅部分浏览器支持。
url (默认: 当前页面地址)
类型: String
发送请求的地址。
async (默认: true)（1.8版本已弃用）
类型: Boolean
默认设置下，所有请求均为异步请求（也就是说这是默认设置为 true ）。如果需要发送同步请求，请将此选项设置为 false 。
data
类型: Object, String
发送到服务器的数据。将自动转换为请求字符串格式。GET 请求中将附加在 URL 后面。查看 processData 选项说明，以禁止此自动转换。对象必须为"{键:值}"格式。如果这个参数是一个数组，jQuery会按照traditional 参数的值， 将自动转化为一个同名的多值查询字符串(查看下面的说明)。注：如 {foo:["bar1", "bar2"]} 转换为 '&foo=bar1&foo=bar2'。
dataType (默认: Intelligent Guess (xml, json, script, or html))
类型: String
预期服务器返回的数据类型。如果不指定，jQuery 将自动根据 HTTP 包 MIME 信息来智能判断，比如XML MIME类型就被识别为XML。在1.4中，JSON就会生成一个JavaScript对象，而script则会执行这个脚本。随后服务器端返回的数据会根据这个值解析后，传递给回调函数。举例:
"json": 把响应的结果当作 JSON 执行，并返回一个JavaScript对象。在 jQuery 1.4 中，JSON 格式的数据以严格的方式解析，如果格式有错误，jQuery都会被拒绝并抛出一个解析错误的异常。（见json.org的更多信息，正确的JSON格式。）
error
类型: Function( jqXHR jqXHR, String textStatus, String errorThrown )
请求失败时调用此函数。有以下三个参数：jqXHR (在 jQuery 1.4.x前为XMLHttpRequest) 对象、描述发生错误类型的一个字符串 和 捕获的异常对象。如果发生了错误，错误信息（第二个参数）除了得到null之外，还可能是"timeout", "error", "abort" ，和 "parsererror"。 当一个HTTP错误发生时，errorThrown 接收HTTP状态的文本部分，比如： "Not Found"（没有找到） 或者 "Internal Server Error."（服务器内部错误）。 从jQuery 1.5开始, 在error设置可以接受函数组成的数组。每个函数将被依次调用。 注意：此处理程序在跨域脚本和JSONP形式的请求时不被调用。这是一个 Ajax Event。
success
类型: Function( Object data, String textStatus, jqXHR jqXHR )
请求成功后的回调函数。这个函数传递3个参数：从服务器返回的数据，并根据dataType参数进行处理后的数据，一个描述状态的字符串;还有 jqXHR（在jQuery 1.4.x前为XMLHttpRequest） 对象 。在jQuery 1.5， 成功设置可以接受一个函数数组。每个函数将被依次调用。这是一个 Ajax Event
其他jQuery-ajax-settings，详见：#jQuery-ajax-settings
举例：
在js中把id作为数据发送到服务器， 保存一些数据到服务器上， 一旦请求完成就通知用户。 如果请求失败，则提醒用户。
var menuId = $("ul.nav").first().attr("id");
var request = $.ajax({
url: "script.php",
type: "POST",
data: {id : menuId},
dataType: "html"
});
request.done(function(msg) {
$("#log").html( msg );
});
request.fail(function(jqXHR, textStatus) {
alert( "Request failed: " + textStatus );
});
注意：此处也可以在ajax()中使用success和error参数判断请求结果成功还是失败，并执行下一步操作。
2.2 js与json
2.2.1 json是什么：
JSON：JavaScript 对象表示法（JavaScript Object Notation）。是独立于语言之外的存储和交换文本信息的语法。
2.2.2 json和ajax的关系？
在上面关于jquery.ajax的介绍中提到了，json可以作为一个ajax函数的dataType，这样数据就会通过json语法传输了。（链接：）
在jquery的ajax函数中，只能传入3种类型的数据：（链接：）
>1.json字符串："uname=alice&mobileIpt=110&birthday=1983-05-12"
>2.json对象：{uanme:'vic',mobileIpt:'110',birthday:'2013-11-11'}
>3.json数组：
[
{"name":"uname","value":"alice"},
{"name":"mobileIpt","value":"110"},
{"name":"birthday","value":"2012-11-11"}
]
2.2.3 json的编解码和数据转换：
2.2.2中提到的json对象是更方便与js数组、js字符串或php数组、php字符串进行数据转化的json类型。下面以json对象为例讲解一下json对象与js和php的数据类型转化。
json对象转化成数组：
<script type="text/javascript">
相关文章
精彩导读
热门资讯
关注我们
