jQuery学习教程，十：AJAX

先复习一下经典的ajax方式

ajax.php

现在时间是<php? echo date('Y-m-d H:i:s');?>

ajax.html

<script type="text/javascript">  
        function Ajax(){ 
                var xmlHttp=null;  
                if(window.ActiveXObject){  
                try{  
                        xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");  
                }catch(e){ 
                        try{  
                                xmlHttp=new ActiveXObject("Microsoft.XMLHTTP")  
                        }catch(e){} 
                } 
                }else if(window.XMLHttpRequest){  
                xmlHttp=new XMLHttpRequest();  
                }  
                if(xmlHttp!=null){  
                        xmlHttp.open("GET","ajax.asp",true); 
                        xmlHttp.onreadystatechange=Call;  
                        xmlHttp.send(null);  
                }  
                var p=document.getElementById("content");  
                function Call(){  
                        if(xmlHttp.readyState==4){  
                                if(xmlHttp.status==200){  
                                        p.innerHTML=xmlHttp.responseText;  
                                } 
                        } 
                }  
        }
</SCRIPT>
<BUTTON onclick=Ajax()>获取</BUTTON>

这里使用ajax算是有些麻烦

再看看使用jQuery

<script type="text/javascript">  
        $(function(){  
                $("button").click(function(){  
                $("p").load("ajax.asp");  
        });  
});  
</script>

$.load()方法

上面使用了load函数。load语法如下，

load(url[,data][,callback])//url:string 类型，请求HTML页面的URl地址；data:Object类型，发送到服务器的key/value数据；callback，Function类型，请 求完成时的回调函数

其中url可使用选择器接收该url中指定地址的某一元素内的文本。这是一个异常强大的功能，假如使用传统js方式的话就需要使用replace去 过滤某些字符，还可能要用到Regex。而现在jQuery只要简单的选择器过滤就可以了。

$("p").load("ajax.php")，ajax.php内容如下：

<h4>获取指定内容的标题</h4>  
<p><?php
     echo data('Y-m-d H:i:s');
?></p>

第二个参数data

<script type="text/javascript">  
        $(function(){  
                $("button").click(function(){  
                        $("p").load("ajax_data.php",{name:"wang",age:"23"},function(responseText,textStatus,XmlHttp){  
                alert("xmlHttp对象：" + XmlHttp + "\r\n请求状态:" + textStatus +   "\r\n获得数据：" + responseText); 
                        });  
                });  
        });  
</script>

ajax_data.php代码

<?php
        if $_POST("name")<>""{
                echo "您的姓名为：" . $_POST("name");  
                echo ",年龄是" . $_POST("age");  
        }
?>

其中参数{name:"王洪剑",age:"23"}显示声明时是以post方式来请求数据的；默认不加参数时以get方式请求。因此应当使用 request.Form("name")来获得数据。 callback代表载入返回数据后执行的函数，它有三个参数可供选择

reponseText//返回的文本

textStatus//请求状态：sucess|error|notmodified|timeout

XmlHttpRequest//XmlHttpRequest对象，Object类型