最近,想学学ajax,所以整个入门例子
<!
DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
>
< html >
< head >
< title > ajax.html </ title >
</ head >
< script language ="javascript" > ...
var http_request = false;
var currentPos = null;
var number1=0;
var number2=0;
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, false);
http_request.send(null);
}
// 处理返回信息的函数
function processRequest() ...{
if (http_request.readyState == 4) ...{ // 判断对象状态
if (http_request.status == 200) ...{ // 信息已经成功返回,开始处理信息
//alert(http_request.responseText);
document.getElementById("showData").innerHTML = http_request.responseText;
} else ...{ //页面不正常
alert("您所请求的页面有异常。");
}
}
}
function showResult() ...{
document.getElementById("showData").innerHTML = "正在读取数据..."
number1=document.getElementById("number_1").value;
number2=document.getElementById("number_2").value;
send_request("ajax.jsp?number_1="+number1+"&number_2="+number2);
}
</ script >
< body >
< input type ="text" id ="number_1" /> * < input type ="text" id ="number_2" onblur ="showResult()" /> =
< label id ="showData" ></ label >< br >
</ body >
</ html >
< html >
< head >
< title > ajax.html </ title >
</ head >
< script language ="javascript" > ...
var http_request = false;
var currentPos = null;
var number1=0;
var number2=0;
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, false);
http_request.send(null);
}
// 处理返回信息的函数
function processRequest() ...{
if (http_request.readyState == 4) ...{ // 判断对象状态
if (http_request.status == 200) ...{ // 信息已经成功返回,开始处理信息
//alert(http_request.responseText);
document.getElementById("showData").innerHTML = http_request.responseText;
} else ...{ //页面不正常
alert("您所请求的页面有异常。");
}
}
}
function showResult() ...{
document.getElementById("showData").innerHTML = "正在读取数据..."
number1=document.getElementById("number_1").value;
number2=document.getElementById("number_2").value;
send_request("ajax.jsp?number_1="+number1+"&number_2="+number2);
}
</ script >
< body >
< input type ="text" id ="number_1" /> * < input type ="text" id ="number_2" onblur ="showResult()" /> =
< label id ="showData" ></ label >< br >
</ body >
</ html >
//
ajax.jsp
<% @ page language = " java " import = " java.util.* " pageEncoding = " GB18030 " %>
<% String number1,number2;
number1 = request.getParameter( " number_1 " );
number2 = request.getParameter( " number_2 " );
out.println(Integer.valueOf(number1).intValue() * Integer.valueOf(number2).intValue());
%>
<% @ page language = " java " import = " java.util.* " pageEncoding = " GB18030 " %>
<% String number1,number2;
number1 = request.getParameter( " number_1 " );
number2 = request.getParameter( " number_2 " );
out.println(Integer.valueOf(number1).intValue() * Integer.valueOf(number2).intValue());
%>