基本的实现方法
varxmlHttp=false;
//如果使用较新版本的InternetExplorer，则需要使用对象Msxml2.XMLHTTP，而较老版本的Internet//Explorer则使用Microsoft.XMLHTTP。非IE则需要XMLHttpRequest。
try{
?xmlHttp=newActiveXObject("Msxml2.XMLHTTP");
}catch(e){
?try{
???xmlHttp=newActiveXObject("Microsoft.XMLHTTP");
?}catch(e2){
???try{
???????????xmlHttp=newXMLHttpRequest();
???catch(e3){
???????alert("您的浏览器不支持AJAX技术");
???}
?}
}
functionsend(){
?varurl="/demo.action"
//注意下写的顺序，有时候顺序写错了会出错
?xmlHttp.open("GET",url,true);?//open函数说明见下方
?xmlHttp.onreadystatechange=callback;//调用回调函数对服务器进行响应
?xmlHttp.send(null);?//一般的内容用url发送信息即可，特殊需求可用send发送信息，这是url发送???????????????????????//信息的写法
}
//回调函数取得服务器回传的信息
functioncallback{
if(xmlHttp.readystatechange
?if(xmlHttp.readyState==4){??//详见HTTP就绪状态
???if(request.status==200){???//详见HTTP状态代码
?????varresponse=xmlHttp.responseText;
???}
?}
}
open()参数
request-type：发送请求的类型。典型的值是GET或POST，但也可以发送HEAD请求。
url：要连接的URL。
asynch：如果希望使用异步连接则为true，否则为false。该参数是可选的，默认为true。
username：如果需要身份验证，则可以在此指定用户名。该可选参数没有默认值。
password：如果需要身份验证，则可以在此指定口令。该可选参数没有默认值。
通常使用其中的前三个参数
HTTP就绪状态
HTTP就绪状态表示请求的状态或情形。它用于确定该请求是否已经开始、是否得到了响应或者请求/响应模型是否已经完成。它还可以帮助确定读取服务器提供的响应文本或数据是否安全。在Ajax应用程序中需要了解五种就绪状态：
???0：请求没有发出（在调用open()之前）。
???1：请求已经建立但还没有发出（调用send()之前）。
???2：请求已经发出正在处理之中（这里通常可以从响应得到内容头部）。
???3：请求已经处理，响应中通常有部分数据可用，但是服务器还没有完成响应。
???4：响应已完成，可以访问服务器响应并使用它。
与大多数跨浏览器问题一样，这些就绪状态的使用也不尽一致。您也许期望任务就绪状态从0到1、2、3再到4，但实际上很少是这种情况。一些浏览器从不报告0或1而直接从2开始，然后是3和4。其他浏览器则报告所有的状态。还有一些则多次报告就绪状态1。在上一节中看到，服务器多次调用updatePage()，每次调用都会弹出警告框——可能和预期的不同！
200一切顺利
?
prototype实现ajax
先看代码
functiondemo(){
????varurl="demo.action";???//请求路径
????varpars="";
?
????varajax=newAjax.Request(url,{method:"post",parameters:pars,onComplete:callback});
??????????????????????????????????????????????????????????????????????????????????????????????????????????????????//callback为回调方法
?????//varajax=newAjax.Updater(div,url,{method:"post",parameters:pars,evalScripts:true});
??????//evaldemo=function(){}
????//使用Ajax.Request类还有一些其它的属性可以在这个对象里面定义和设置，如asynchronous，可以为true或false来决定AJAX对服务器的调用是否是异步的（默认值是true）。
???//还有另外两个有用的选项用来处理结果。我们可以在onSuccess选项处传入一个方法，当AJAX无误的执行完后调，相反的，也可以在onFailure选项处传入一个方法，当服务器端出现错误时调用。
}
functioncallback(request){???//回调方法需有一个参数
??vars=request.responseText;?????//得到服务器返回信息
}
更多使用方法参见prototype的帮助文档
dojo实现ajax
functiondemo(){
???varpars={actionSign:''firstlogin'',userid:dojo.byId(''userid'').value};?//请求参数格式为{参数名:值}
???dojo.xhrPost({?????????//使用post请求?对应get请求的方法为xhrGet
????????url:"demo.action",
???????content:pars,
???????preventCatch:true,????????//不使用浏览器缓存?如果使用的话，两个一样的请求，浏览器会从缓存中调用上次请求的结果
???????handleAs:''text'',??????????//返回的数据格式
???????load:function(data){???//成功请求后的动作
???????????callback(data);
???????},
???????error:function(response,ioArgs){????//请求错误后的动作
????????????alert("HTTPstatuscode:"+ioArgs.xhr.status);
???????}???
???});
???
}
关于prototype与dojo在ajax使用上的一个小细节问题：
如果请求反回的是一个网页，且此网页中含有javascript方法，建议使用prototype，它可以保证这些JS方法的正确调用，但需要注意下方法格式demo=function(){}，不然JS方法会被直接执行，不会根据事件触发执行。示例如下：
functiondemo(){
????varurl="demo.action";???//请求路径
????varpars="";//??????????
????pars="d1=2"
?????varajax=newAjax.Updater(div,url,{method:"post",parameters:pars,evalScripts:true});
}
|
|
