Web 2.0中AJAX技术应用详解

来源: 时间:06-11-28 点击: 点击这里收藏本文

　　第二个参数是请求页面的URL。

　　第三个参数设置请求是否为异步模式。如果是TRUE，JavaScript函数将继续执行，而不等待服务器响应。这就是"AJAX"中的"A"。

　　用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

9 7 3 1 2 3 4 8 :

把此文章收藏到：　　　　　

相关教程

·ASP+AJAX打造无刷新新闻评论系

·AjaxPro让.NET的AjaxPro变得简

·AJAX技术 vs 传统的ASP无刷新技

·AJAX技术 vs 传统的ASP无刷新技

广而告之

文章搜索

Google JZxue.Com

最新文章

网站推广—网站建设的关键课

吸引访客,做内容有价值的网

关于Photoshop直方图的详细

网站策划,B2B网站策划者应

Web标准网站开发人员配备

便宜/廉价的网站推广方式

写给做BBS的新站长

行为经济学在网站运营中的

漫谈网站改版的必要性

网站策划需要具备的知识

外贸网站建设全攻略

CSS让网页更容易设计与维护

和马云学习如何做网站推广

推荐导读

优秀个人网站打造全过程

热门排行

如何制作网页（网页制作实

如何选择网页制作工具

下载安装Dreamweaver8

制作主页前的准备

垃圾站全教程--之一(新手上

怎样个人网页制作,制作个人

制作模板

在Dreamweaver设置站点

制作首页

网站设计65条原则

规划站点

中国所有银行的BIC code(即

个人主页制作完全手册