函数ask()与服务器进行通讯并分配一个回调函数来处理服务器的响应(见下列代码)。后面,我们将分析具有双重特点的resolveZip.jsp的内容-它根据zip字段中的字符数查找city或state信息。重要的是,ask()使用了具有异步特点的XmlHttpRequest,这样填充state和city字段或着色zip字段边界就可以不必减慢数据入口而得以实现。首先,我们调用request.open()-它用服务器打开套接字频道,使用一个HTTP动词(GET或POST)作为第一个参数并且以数据提供者的URL作为第二个参数。request.open()的最后一个参数被设置为true-它指示该请求的异步特性。注意,该请求还没有被提交。随着对request.send()的调用,开始提交-这可以为POST提供任何必要的有效载荷。在使用异步请求时,我们必须使用request.onreadystatechanged属性来分配请求的回调函数。(如果请求是同步的话,我们应该能够在调用request.send之后立即处理结果,但是我们也有可能阻断用户,直到该请求完成为止。)
HTTPRequest = function () {
var xmlhttp=null;
try {
xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
} catch (_e) {
try {
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
} catch (_E) { }
}
if (!xmlhttp && typeof XMLHttpRequest != 'undefined') {
try {
xmlhttp = new XMLHttpRequest();
} catch (e) {
xmlhttp = false;
}
}
return xmlhttp;
}
function ask(url, fieldToFill, lookupField) {
var http = new HTTPRequest();
http.open("GET", url, true);
http.onreadystatechange = function (){ handleHttpResponse(http, fieldToFill,lookupField)};
http.send(null);
}
function handleHttpResponse(http, fieldToFill, lookupField) {
if (http.readyState == 4) {
result = http.responseText;
if ( -1 != result.search("null") ) {
lookupField.style.borderColor = "red";
fieldToFill.value = "";
} else {
lookupField.style.borderColor = "";
fieldToFill.value = result;
}
}
}
该函数的代码是动态创建的并且在每次我们给http.onreadstatechange属性赋值时被编译。结果,JavaScript创建一个指向上下文(所有的变量都可以存取正在结束的方法-ask())的指针。这样以来,匿名函数和handleResponse()就能够被保证充分存取所有的上下文宿主的变量,直至到匿名函数的参考被垃圾回收站收集为止。换句话说,无论何时我们的匿名函数被调用,它都能无缝地参考request,fieldToFill和lookupField变量,就象它们是全局的一样。而且,每次ask()调用都将创建环境的一个独立拷贝,并且此时这些变量中保存有该函数将结束时的值。
现在,让我们分析一下函数handleResponse()。既然它能够在请求处理的不同状态下激活,那么该函数将忽略所有的情形-除了该请求处理完成之外-这相应于request.readyState属性等于4("Completed")。此时,该函数读取服务器的响应文本。与它的名字所暗示的相反,XmlHttpRequest的输入和输出都不必限于XML格式。特别地,我们的resolveZip.jsp(见源码中的列表1)返回普通文本。如果返回值为"unknown",那么该函数将假定邮政区号是无效的并且把查找字段(zip)边界颜色置为红色。否则,返回值被用于填充字段state或city,并且zip的边界被赋予一种缺省颜色。让我们返回到我们的XMLHTTPRequest的跨浏览器实现。最后一个列表包含一个HttpRequest()函数-它向上兼容于IE5.0和Mozilla 1.8/FireFox。为简化起见,我们只创建一个微软XMLHTTPRequest对象,而且如果创建失败,我们假定它是Firefox/Mozilla。
该函数的核心是XMLHTTPRequest-这是一个本机浏览器对象,它为包括HTTP协议的任何东西与服务器之间的通讯提供方便。它允许指定任何HTTP动词,头部和有效载荷,并且能够以异步或同步方式工作。不需要下载也不需要安装任何插件-尽管在IE的情形下,XMLHTTPRequest是一个集成到浏览器内部的ActiveX。因而,"Run ActiveX Control and Plugins"默认IE权限应该正好适合使用它。
最重要的是,XMLHTTPRequest允许一个到服务器的RPC风格的编程查询而不需要任何页面刷新。它以一种可预测的,可控制的方式来实现此-提供了到HTTP协议的所有细节的完整存取-包括头部和数据的任何定制格式。在以后的文章中,我们将向你展示其它一些业界协议-你可以在这些传输协议(如Web服务和XML-RPC)之上运行-它们极大地简化大规模应用程序的开发和维护。