AJAX简单应用

提到ajax大家都很清楚，其主要的作用就是异步提交数据。基本上所有的ajax应用程序都有雷同的流程：

1、从 Web 表单中获取需要的数据。

2、建立要连接的 URL。

3、打开到服务器的连接。

4、设置服务器在完成后要运行的函数。

5、发送请求。

下面简单介绍上面流程的实现过程：

1.基本上实现异步操作主要是靠操作一个对象，即XMLHttpRequest对象。所以首先应该建立并实例化一个 XMLHttpRequest对象：var xmlHttp=new XMLHttpRequest object；

2.获取web界面要传递的数据，这个很简单，如下：

var city = document.getElementById("city").value;

3.发出ajax请求：

1）// 建立URL连接

var url = "/scripts/getZipCode.PHP?city=" + escape(city)

2）//打开URL连接，其中的参数：第一个为提交方式（get/post）；第二个为连接到服务器的地址；第三 个为是否为异步操作，为true表示为异步，为false表示同步，发送请求后必须等到回复才能

xmlHttp.open("GET",url,true);

3）// 设置回调函数，即发送成功后调用的函数

xmlHttp.onreadystatechange = updatePage;

4）// 发送请求

xmlHttp.send(null);

4.处理服务器的相应（此为回调函数中对服务器 发送回来的数据的处理）

function updatePage() {

if (xmlHttp.readyState == 4) {

var response = xmlHttp.responseText;

document.getElementById("zipCode").value = response;

}

}

// 解释：上面有一个属性readyState，为状态码，其值有5个（0,1,2,3,4）为4表示相应服务器的操作应经完 成，可以获取并使用服务器的响应了

总结：自我认为ajax的操作基本上就是这些，其遵循上面的几个步骤：实例化XMLHttpRequest对象，获取连接地址及传送数据，打开连接地址，设置回调函数，发送请求。如果有什么不足的地方，望大鸟指正。