首先 提供一个简单的ajax应用，包含两个jsp文件，一个提交请求，一个处理请求。
提交请求：ajaxtest.jsp
< %@ page contentType="text/html; charset=GB2312" %>
< html>
< head>
< title>
ajaxtest
< /title>
< script language="javascript">
var count = 0;
var running = false;
var http_request;
function send_request(url) {//初始化、指定处理函数、发送请求的函数
http_request = false;
//开始初始化XMLHttpRequest对象
if(window.XMLHttpRequest) { //Mozilla 浏览器
http_request = new XMLHttpRequest();
if (http_request.overrideMimeType) {//设置MiME类别
http_request.overrideMimeType('text/xml');
}
}
else if (window.ActiveXObject) { // IE浏览器
try {
http_request = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
http_request = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e) {}
}
}
if (!http_request) { // 异常，创建对象实例失败
window.alert("不能创建XMLHttpRequest对象实例.");
return false;
}
http_request.onreadystatechange = processRequest;
// 确定发送请求的方式和URL以及是否同步执行下段代码
http_request.open("GET", url, true);
http_request.send(null);
}
// 处理返回信息的函数
function processRequest() {
if (http_request.readyState == 4) { // 判断对象状态
if (http_request.status == 200) { // 信息已经成功返回，开始处理信息
var rtext = http_request.responseText;
document.getElementById("refreshtext").innerHTML = rtext + "< br>"
+ document.getElementById("refreshtext").innerHTML;
} else { //页面不正常
alert("您所请求的页面有异常。");
}
}
}
function refreshTable() {
k = new Date();
send_request('ajaxtestresponse.jsp?count=' + (++count) + '&refreshtime='+k);
}
//window.setTimeout('refreshTable()',10000);
< /script>
< /head>
< body bgcolor="#ffffff">
< h1>
AJAX TEST< /h1>< br>
< input type="button" onClick="refreshTable();" value="ClickMe">
< br>
< span id="refreshtext">< /span>
< /body>
< /html>
响应请求：ajaxtestresponse.jsp
< %
String count = request.getParameter("count");
String ctime = request.getParameter("refreshtime");
try {
Thread.sleep(5000);
}
catch (InterruptedException ex1) {
}
out.write("Hello world-"+count+"-"+ctime);
%>
其中，提交请求包含一个技术参数，响应请求延迟5秒左右的时间，再返回请求，以表示系统延迟比较大。
在tomcat中运行http://localhost:8080/ajaxtest.jsp 点击按钮，发送请求，然后等待回应，如果在没有回应之前，连续点击按钮提交请求，虽然后台接收到了这些请求，但是由于对运行状态的判断，web浏览器只能接收到最后一个返回的响应。
为了让浏览器能够全部接受返回的信息，有两个办法：
1、将
// 确定发送请求的方式和URL以及是否同步执行下段代码
http_request.open("GET", url, true);
改为
http_request.open("GET", url, false);
表示等到响应接收到后，才能进行其它操作， 这样web浏览器发送请求后会有较长时间的停顿，影响客户体验，不好。
2、将
function refreshTable() {
k = new Date();
send_request('ajaxtestresponse.jsp?count=' + (++count) + '&refreshtime='+k);
}
改为
function refreshTable() {
if(http_request){
if(http_request.readyState!=4) {
window.setTimeout('refreshTable()',500);
return;
}
}
k = new Date();
send_request('ajaxtestresponse.jsp?count=' + (++count) + '&refreshtime='+k);
}
增加状态判断，并进行延迟。 客户体验好。