使用ajax实现动态局部刷新
发布时间：2020-12-16 01:03:03 所属栏目：百科 来源：网络整理
导读：span style= "font-size: medium;" refresh.jsp %@ page contentType= "text/html;charset=UTF-8" language= "java" % headMETA http-equiv=Content-Type content= "text/html; charset=UTF-8" /head script language= "javascript" var XMLHttpReq; //创建X
<span style=
"font-size: medium;"
>refresh.jsp
<%@ page contentType=
"text/html;charset=UTF-8"
language=
"java"
%>
<head><META http-equiv=Content-Type content=
"text/html; charset=UTF-8"
></head>
<script language=
"javascript"
>
var XMLHttpReq;
//创建XMLHttpRequest对象
function createXMLHttpRequest() {
if
(window.XMLHttpRequest) {
//Mozilla 浏览器
XMLHttpReq =
new
XMLHttpRequest();
}
else
if
(window.ActiveXObject) {
// IE浏览器
try
{
XMLHttpReq =
new
ActiveXObject(
"Msxml2.XMLHTTP"
);
}
catch
(e){
try
{
XMLHttpReq =
new
ActiveXObject(
"Microsoft.XMLHTTP"
);
}
catch
(e) {
}
}
}
}
//发送请求函数
function sendRequest() {
createXMLHttpRequest();
var url =
"refresh.do"
;
XMLHttpReq.open(
"POST"
,url,
true
);
XMLHttpReq.onreadystatechange = processResponse;
//指定响应函数
XMLHttpReq.send(
null
);
// 发送请求
}
// 处理返回信息函数
function processResponse() {
if
(XMLHttpReq.readyState ==
4
) {
// 判断对象状态
if
(XMLHttpReq.status ==
200
) {
// 信息已经成功返回，开始处理信息
DisplayHot();
setTimeout(
"sendRequest()"
,
1000
);
}
else
{
//页面不正常
window.alert(
"您所请求的页面有异常。"
);
}
}
}
// 显示更新数据信息的函数
function DisplayHot() {
var name = XMLHttpReq.responseXML.getElementsByTagName(
"name"
)[
0
].firstChild.nodeValue;
var count = XMLHttpReq.responseXML.getElementsByTagName(
"count"
)[
0
].firstChild.nodeValue;
document.getElementById(
"product"
).innerHTML = name;
document.getElementById(
"count"
).innerHTML = count;
}
</script>
</SCRIPT>
<body onload =sendRequest()>
<table style=
"BORDER-COLLAPSE: collapse"
borderColor=#
222221
cellSpacing=
0
cellPadding=
0
width=
200
bgColor=#f5efe7 border=
0
>
<TR>
<TD align=middle height=
4
colspan=
"2"
><IMG height=
4
src=
"images/promo_list_top.gif"
width=
"100%"
border=
0
>
</TD>
</TR>
<TR>
<TD align=middle bgColor=#dbc2b0
height=
19
colspan=
"2"
><B>正在热卖的笔记本</B>
</TD>
</TR>
<tr>
<td height=
"20"
>
型号：
</td>
<td height=
"20"
id=
"product"
>
</td>
</tr>
<tr>
<td height=
"20"
>
销售数量：
</td>
<td height=
"20"
id=
"count"
>
</td>
</tr>
</table>
</body>
</html>
</span>
（编辑：李大同） 【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容! |