详细请参考官方文档:https://www.jquery123.com/category/ajax/
首先须要引入jquery文件!
!
!
$.ajax({ // 设置要求地址 url: 'json.php', // 设置要求办法(不设置时默认为get) type: 'get', // 设置的是要求参数 data: {id: 1, name: '张三'}, // 用于设置相应体的类型 把稳跟 data 参数没紧要 dataType: 'json', success: function (res) { // res 会自动根据做事端相应的 Content-Type 自动转换为工具 // 这是 jquery 内部实现的 console.log(res); } });
json.php

<?php
$xiaofang = array('name' => '小方', 'age' => 18);
echo json_encode($xiaofang);
掌握台显示:
把稳:设置了 dataType 之后,同时在做事端设置了 Content-Type之后,则不会管做事端设置了哪种文档类型!
!
!
现在,我们在 json.php 中设置 applicatioin/xml
<?php
$xiaofang = array('name' => '小方', 'age' => 18);
header('Content-Type: application/xml');
echo json_encode($xiaofang);
掌握台还是显示
$.ajax 中的 callback
$.ajax({ url: 'time.php', type: 'get', beforeSend: function (xhr) { // 在所有(open,send)之前实行 console.log('beforeSend', xhr); }, // 只有要求成功(状态码为200)才会实行这个函数 success: function (res) { console.log('success', res); }, error: function (xhr) { // 只有要求不正常(状态码不为200)才会实行 console.log('error', xhr); }, complete: function (xhr) { // 要求完成:不管是成功还是失落败都会触发 console.log('complete', xhr); } });
运行结果:(这算是要求成功了)
现在我们将存在的地址改变为一个不存在的地址再次要求
运行结果则会是
$.get和$.post(我们大多数利用这两个)
正如方法名一样,$.get 便是利用 get 的要求办法对做事端进行要求
$.post 便是利用 post 的要求办法对做事端进行要求
两个方法的参数为:
第一个参数:要求地址
第二个参数:通报到做事真个参数(利用工具办法即可,也可利用 urlencoded 形式)
第三个参数:回调函数(吸收相应体)
$.get('time.php', {id: 1}, function (res) { console.log(res); }); $.post('time.php', {id: 1}, function (res) { console.log(res); });
$.get('time.php', 'id=1', function (res) { console.log(res); }); $.post('time.php', 'id=1', function (res) { console.log(res); });
如果我们必须要从做事端吸收 JSON 格式的数据的话,那么就要利用 $.getJSON()了,并且一定要在做事端设置 'Content-Type: application/json'。不然拿到的数据是字符串类型的
例如:
json.php
$xiaofang = array('name' => '小方', 'age' => 18);
echo json_encode($xiaofang);
ajax
$.getJSON('json.php', {id: 1}, function (res) { console.log(res); });
运行结果
现在我们在做事端设置 'Content-Type: application/json'
<?php
$xiaofang = array('name' => '小方', 'age' => 18);
header('Content-Type: application/json');
echo json_encode($xiaofang);
那么,运行结果为: