也就是直接编写onRecorderStateChange的事件函数,如果readyState的状态为4(数据接收成功)则继续操作。但是通常情况下,不但需要判断请求的状态,还要判断服务器返回的状态status,因此上述代码改为
复制代码 代码如下:
<script type="text/javascript">
xmlHttp.onRecorderStateChange = function(){
if(xmlHttp.readyState == 4&& xmlHttp.status==200)
//执行相关代码
}
</script>
以上两段代码仅仅只是建立了请求,还需要使用send()方法来发送请求,该方法的原型如下:
send(body);
改方法仅有一个参数body,它表示要向服务器发送的数据,其格式为查询字符串的形式,例如:
var body = "myName=isaac&age=25";
如果再open中指定的是get方式,则这些参数作为查询字符串提交,如果指定的是post方式,则作为HTTP的POST方法提交。对于send()而言。body参数是必须的,如果不发送任何数据,则可以使用
xmlHttp.send(null)
特别的,如果使用POST方法进行提交请求,那么在发送之前必须使用以下语句来设置HTTP的头,语法如下:
xmlHttp.setRequestHeader("content-Type","application/x-www-form-urlencoded;")
服务器在收到客户端请求之后,根据请求返回相应的结果,这个结果通常为两种形式,一种是文本形式,存储在responseText中;另一种是XML格式,存储在responseXML中。客户端程序可以对前者进行字符串的处理,对后者进行DOM相关的处理,例如可以对服务器返回值做如下的处理:
alert("服务器返回:"+xmlHttp.responseText);
上述整个异步连接服务器的过程如下:
复制代码 代码如下:
<body>
<script type="text/javascript">
var xmlHttp;
function createXMLHttpRequest() {
if (window.ActiveXObject)
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
else if (window.XMLHttpRequest)
xmlHttp = new XMLHttpRequest();
}
function startRequest() {
createXMLHttpRequest();
xmlHttp.open("GET", "", true);
xmlHttp.onreadystatechange = function() {
if (xmlHttp.readyState == 4 && xmlHttp.status == 200)
alert("服务器返回: " + xmlHttp.responseText);
}
xmlHttp.send(null);
}
</script>
<input type="button" value="测试异步通讯">
</body>
为了解决异步连接ie缓存问题,需要在真实地址加一个与时间毫秒相关的参数,使得每次请求的地址都不一样。而该参数服务器确是不需要的。
复制代码 代码如下:
var sUrl = "1-1.aspx?"+new Date().getTime();//地址不断变化
XMLHttp.open("GET",sUrl,true);
2.GET和POST模式