Ajax极速参考
AJAX 的要点是 XMLHttpRequest 对象。不同的浏览器创建 XMLHttpRequest 对象的方法是有差异的。IE 浏览器使用 ActiveXObject,而其他的浏览器使用名为 XMLHttpRequest
的 JavaScript 内建对象。
1,创建XMLHttpRequest.
2 var xmlHttp;
3 try{
4 // Firefox, Opera 8.0+, Safari
5 xmlHttp=new XMLHttpRequest();
6 }catch (e){
7 // Internet Explorer
8 try{
9 xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
10 }catch (e){
11 try{
12 xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
13 }catch (e){
14 alert("您的浏览器不支持AJAX!");
15 return null;
16 }
17 }
18 }
19 return xmlHttp;
20 }
2,XMLHttpRequest与服务器的通信。
在向服务器发送数据之前,我们有必要解释一下 XMLHttpRequest 对象的三个重要的属性。
<1>onreadystatechange 属性:该属性存有处理服务器响应的函数。
<2>readyState属性:该属性存有服务器响应的状态信息。每当 readyState 改变时,onreadystatechange 函数就会被执行。readyState可能的值如下:
0--请求未初始化(在调用 open() 之前)
1--请求已提出(调用 send() 之前)
2--请求已发送(这里通常可以从响应得到内容头部)
3--请求处理中(响应中通常有部分数据可用,但是服务器还没有完成响应)
4--请求已完成(可以访问服务器响应并使用它)
<3>如下列代码在请求完成时获取返回数据并填充到表单myForm的文本框time中:
2 {
3 if(xmlHttp.readyState==4)
4 {
5 document.myForm.time.value=xmlHttp.responseText;
6 }
7 }
8
要想把请求发送到服务器,我们就需要使用 open() 方法和 send() 方法。
open() 方法需要三个参数。第一个参数定义发送请求所使用的方法(GET 还是 POST)。第二个参数规定服务器端脚本的 URL。第三个参数规定应当对请求进行异步地处理。
send() 方法可将请求送往服务器。
2 xmlHttp.send(null);
3
POST请求方法实例:
2 @params:
3 url:提交字符串
4 params:参数,形如:a=1&c=2
5 */
6 function PostRequest(url,params){
7 xmlHttp=GetXMLHttp();
8 xmlHttp.onreadystatechange = HandleResponse;
9 xmlHttp.open("post",url,true);
10 xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded"); //设置服务器响应请求体参数
11 xmlHttp.send(params);
12 }
posted on 2009-10-11 11:35 Joshua Leung 阅读(217) 评论(0) 编辑 收藏 举报