您当前的位置：飞翔学院-IT中国 → 编程开发 → AJAX → 文章内容

理解AJAX工作原理构建网站的有效方法

作者:佚名来源:不详发布时间:2007-12-10 22:48:33

　　清单 5. 发出 Ajax 请求

function　callServer()　{
　 //　Get　the　city　and　state　from　the　web　form
　 var　city　=　document.getElementById("city").value;
　 var　state　=　document.getElementById("state").value;
　 //　Only　go　on　if　there　are　values　for　both　fields
　 if　((city　==　null)　||　(city　==　""))　return;
　 if　((state　==　null)　||　(state　==　""))　return;
　 //　Build　the　URL　to　connect　to
　 var　url　=　"/scripts/getZipCode.php?city="　+　escape(city)　+　"&state="　+　escape(state);
　 //　Open　a　connection　to　the　server
　 xmlHttp.open("GET",　url,　true);
　 //　Setup　a　function　for　the　server　to　run　when　it's　done
　 xmlHttp.onreadystatechange　=　updatePage;
　 //　Send　the　request
　 xmlHttp.send(null);
}

　　其中大部分代码意义都很明确。开始的代码使用基本 JavaScript 代码获取几个表单字段的值。然后设置一个 PHP 脚本作为链接的目标。要注意脚本 URL 的指定方式，city 和 state（来自表单）使用简单的 GET 参数附加在 URL 之后。

　　然后打开一个连接，这是您第一次看到使用 XMLHttpRequest。其中指定了连接方法（GET）和要连接的 URL。最后一个参数如果设为 true，那么将请求一个异步连接（这就是 Ajax 的由来）。如果使用 false，那么代码发出请求后将等待服务器返回的响应。如果设为 true，当服务器在后台处理请求的时候用户仍然可以使用表单（甚至调用其他 JavaScript 方法）。