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

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';
?>

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

相关文章