ajax02.html
客户端
<!DOCTYPE html>
<!--课件_52.第九章：Ajax技术[7]-$.ajax方法.rar，很常用-->
<html id="html">
<head>
<Meta charset="utf-8" />
<title>demo</title>
<script type="text/javascript" src="jquery-2.1.4.min.js"></script>
<style type="text/css">
</style>
<script type="text/javascript">
$(function(){
$('button').click(function(){
/*
$.ajax('return.PHP',{
success:function(data,textStatus,jqXHR){
console.log(':))');
console.log(data);
}
});
*/
$.ajax({
url:'http://localhost/MyTestAjax08/return.PHP',//请求的URL地址
type:'get',//设置请求的http方式，method也可以
dataType:'json',//将服务器端返回的数据直接认定为是这个格式，然后会做一些自动的处理(如果是json字符串，会自动转化为js对象),服务器返回的默认格式是text/html格式
data:{//向服务器端发送的数据
name:'孙胜利',sex:true
},success:function(data,jqXHR){//请求成功之后执行的回调函数
//console.log(':))');
console.log(data);
//console.log(this);
},error:function(jqXHR,errorThrown){//请求失败之后执行的回调函数
console.log(errorThrown);
}
// beforeSend:function(jqXHR,settings){//在请求正式发起之前执行的回调函数，我们可以利用它在请求的配置对象进行一些修改！
// //settings.url='test/a.PHP';
// //console.log('请求之前执行的我！');
// //return false;//取消本次请求
// },// complete:function(jqXHR,textStatus){//请求完成之后执行的回调函数(无论成功还是失败)
// console.log('请求完成了！');
// },//context:$('#div1'),//设置回调函数内this的值
//timeout:2000,//为本次Ajax请求设置一个超时时间！
//async:false,//是否以异步请求发出
//cache:false,//不缓存
/*
dataFilter:function(data,type){//设置讲服务器端返回的原生的数据进行处理的回调函数（注意：一定要将处理完的数据return）
return data.toupperCase();
},*/
/*
converters:{//控制返回数据的格式转换方式！
"text json":function(data){
return data;
},"text html":function(data){
return $(data);
}
},*/
//global:false//设置是否触发全局的Ajax回调函数！
});
});
});
</script>
</head>
<body>
<button>开始</button>
<div id="div1">
div1
</div>
</body>
</html>
return.PHP
服务器端
<?PHP
sleep(1);
//$html=<<<A
//<ul class="ul0">
// <li>哈哈！</li>
// <li>哈哈！</li>
// <li>哈哈！</li>
// <li>哈哈！</li>
// <li>哈哈！</li>
//</ul>
//<ul class="ul1">
// <li>哈哈！</li>
// <li>哈哈！</li>
// <li>哈哈！</li>
// <li>哈哈！</li>
// <li>哈哈！</li>
//</ul>
//A;
$json=<<<A
{"name":"孙胜利"}
A;
echo $json;
//echo 'hello world';
?>