【 tulaoshi.com - Web开发 】
处理响应
现在要面对服务器的响应了。现在只要知道两点：
什么也不要做，直到xmlHttp.readyState属性的值等于4。
服务器将把响应填充到xmlHttp.responseText属性中。
其中的第一点，即就绪状态，将在下一篇文章中详细讨论，您将进一步了解HTTP请求的阶段，可能比您设想的还多。现在只要检查一个特定的值（4）就可以了（下一期文章中还有更多的值要介绍）。第二点，使用xmlHttp.responseText属性获得服务器的响应，这很简单。清单6中的示例方法可供服务器根据清单5中发送的数据调用。
清单6.处理服务器响应
functionupdatePage(){
if(xmlHttp.readyState==4){
varresponse=xmlHttp.responseText;
document.getElementById("zipCode").value=response;
}
}
这些代码同样既不难也不复杂。它等待服务器调用，如果是就绪状态，则使用服务器返回的值（这里是用户输入的城市和州的ZIP编码）设置另一个表单字段的值。于是包含ZIP编码的zipCode字段突然出现了，而用户没有按任何按钮！这就是前面所说的桌面应用程序的感觉。快速响应、动态感受等等，这些都只因为有了小小的一段Ajax代码。
细心的读者可能注意到zipCode是一个普通的文本字段。一旦服务器返回ZIP编码，updatePage()方法就用城市/州的ZIP编码设置那个字段的值，用户就可以改写该值。这样做有两个原因：保持例子简单，说明有时候可能希望用户能够修改服务器返回的数据。要记住这两点，它们对于好的用户界面设计来说很重要。
连接Web表单
还有什么呢？实际上没有多少了。一个JavaScript方法捕捉用户输入表单的信息并将其发送到服务器，另一个JavaScript方法监听和处理响应，并在响应返回时设置字段的值。所有这些实际上都依赖于调用第一个JavaScript方法，它启动了整个过程。最明显的办法是在HTML表单中增加一个按钮，但这是2001年的办法，您不这样认为吗？还是像清单7这样利用JavaScript技术吧。
清单7.启动一个Ajax过程
form
pCity:inputtype="text"name="city"id="city"size="25"
onChange="callServer();"//p
pState:inputtype="text"name="state"id="state"size="25"
onChange="callServer();"//p
pZipCode:inputtype="text"name="zipCode"id="city"size="5"//p
/form
如果感觉这像是一段相当普通的代码，那就对了，正是如此！当用户在city或state字段中输入新的值时，callServer()方法就被触发，于是Ajax开始运行了。有点儿明白怎么回事了吧？好，就是如此！
结束语
现在您可能已经准备开始编写第一个Ajax应用程序了，至少也希望认真读一下参考资料中的那些文章了吧？但可以首先从这些应用程序如何工作的基本概念开始，对XMLHttpRequest对象有基本的了解。在下一期文章中，您将掌握这个对象，学会如何处理JavaScript和服务器的通信、如何使用HTML表单以及如何获得DOM句柄。
现在先花点儿时间考虑考虑Ajax应用程序有多么强大。设想一下，当单击按钮、输入一个字段、从组合框中选择一个选项或者用鼠标在屏幕上拖动时，Web表单能够立刻作出响应会是什么情形。想一想异步究竟意味着什么，想一想JavaScript代码运行而且不等待服务器对它的请求作出响应。会遇到什么样的问题？会进入什么样的领域？考虑到这种新的方法，编程的时候应如何改变表单的设计？
如果在这些问题上花一点儿时间，与简单地剪切/粘贴某些代码到您根本不理解的应用程序中相比，收益会更多。在下一期文章中，我们将把这些概念付诸实践，详细介绍使应用程序按照这种方式工作所需要的代码。因此，现在先享受一下Ajax所带来的可能性吧。
