用JavaScript来创建XMLHttpRequest 类向服务器发送一个HTTP请求后，接下来要决定当收到服务器的响应后，需要做什么。这需要告诉HTTP请求对象用哪一个JavaScript函数处理这个响应。可以将对象的onreadystatechange属性设置为要使用的JavaScript的函数名，如下所示：xmlhttp_request.onreadystatechange =FunctionName;
FunctionName是用JavaScript创建的函数名，注意不要写成FunctionName()，当然我们也可以直接将JavaScript代码创建在onreadystatechange之后，例如：
xmlhttp_request.onreadystatechange = function(){
// JavaScript代码段
};
在这个函数中。首先要检查请求的状态。只有当一个完整的服务器响应已经收到了，函数才可以处理该响应。XMLHttpRequest 提供了readyState属性来对服务器响应进行判断。
readyState的取值如下：
0 (未初始化)
1 (正在装载)
2 (装载完毕)
3 (交互中)
4 (完成)
所以只有当readyState=4时，一个完整的服务器响应已经收到了，函数才可以处理该响应。具体代码如下：
if (http_request.readyState == 4) {
// 收到完整的服务器响应
} else {
// 没有收到完整的服务器响应
}
当readyState=4时，一个完整的服务器响应已经收到了，接着，函数会检查HTTP服务器响应的状态值。完整的状态取值可参见W3C文档。当HTTP服务器响应的值为200时，表示状态正常。
在检查完请求的状态值和响应的HTTP状态值后，就可以处理从服务器得到的数据了。有两种方式可以得到这些数据：(1) 以文本字符串的方式返回服务器的响应
(2) 以XMLDocument对象方式返回响应
实例一： 用文本字符串的方式返回服务器的响应来验证网易通行证帐号是否存在
首先，我们登陆网易通行证注册页面，可以看到检测用户名是否存在是将用户名提交给checkssn.jsp页面进行判断，格式为：
reg.163.com/register/checkssn.jsp?username=用户名 根据上面讲到的方法，我们可以利用AJAX技术对网易通行证用户名进行检测：
第一步：新建一个基于Xhtml标准的网页，在区域插入Javascript函数如下：
function getXMLRequester( )
{
var xmlhttp_request = false;
try{
if( window.ActiveXObject )
{
for( var i = 5; i; i-- ){
try{
if( i == 2 )
{
xmlhttp_request = new ActiveXObject( "Microsoft.XMLHTTP" );
}
else
{
xmlhttp_request = new ActiveXObject( "Msxml2.XMLHTTP." + i + ".0" );
xmlhttp_request.setRequestHeader("Content-Type","text/xml"); xmlhttp_request.setRequestHeader("Content-Type","gb2312"); }
break;}
catch(e){ xmlhttp_request = false;
}
}
}
else if( window.XMLHttpRequest )
{
xmlhttp_request = new XMLHttpRequest();
if (xmlhttp_request.overrideMimeType)
{
xmlhttp_request.overrideMimeType('text/xml');
}
}
}
catch(e){ xmlhttp_request = false; }
return xmlhttp_request ;
}
function IDRequest(n)
{
//定义收到服务器的响应后需要执行的JavaScript函数 url=n+document.getElementById('163id').value;
//定义网址参数 xmlhttp_request=getXMLRequester();
//调用创建XMLHttpRequest的函数 xmlhttp_request.onreadystatechange = doContents;
//调用doContents函数 xmlhttp_request.open('GET', url, true); xmlhttp_request.send(null); } function doContents()
{
if (xmlhttp_request.readyState == 4)
{
// 收到完整的服务器响应
if (xmlhttp_request.status == 200) {
//HTTP服务器响应的值OK
document.getElementById('message').innerHTML = xmlhttp_request.responseText;
//将服务器返回的字符串写到页面中ID为message的区域 }
else {
alert(http_request.status);
}
}
}
在区域建立一个文本框，id为163id
再建一个id为messsge的空白区域用来显示返回字符串(也可以通过Javascript函数截取一部分字符串显示)：
这样，一个基于AJAX技术的用户名检测页面就做好了，不过这个页面将返回服务器响应生成页面的所有字符串，当然还可以对返回的字符串进行一些操作，便于应用到不同的需要当中。
更多内容请看PCdog.com--Ajax的WEB开发 Ajax基础教程 Ajax技术专题
上一页 [1] [2] [3] 下一页
打印文档
推荐好友 
返回顶部
增大字体 
减少字体