您的位置:首页 > 其它

课件_52.第九章:Ajax技术[7]-$.ajax方法.rar,很常用

2015-11-28 08:27 417 查看
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,textStatus,jqXHR){//请求成功之后执行的回调函数
//console.log(':))');
console.log(data);
//console.log(this);
},
error:function(jqXHR,textStatus,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';
?>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: