AJAX的DWR框架实现无闪动自动刷新页面

ajax的dwr框架定时无闪动局部数据更新
test.jsp
<%@ page language="java" contentType="text/html; charset=utf-8"
pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>DWR测试</title>
<script type='text/javascript' src='<%= request.getContextPath() %>/dwr/engine.js'></script>
<script type='text/javascript' src='<%= request.getContextPath() %>/dwr/util.js'></script>
</head>
<script>
var time = 5000;
var i=0;
window.setInterval('Check()',time);
//在此处我们可以通过该函数来调用java类,返回一个list,并用该list来更新页面数据
function Check()
{
//获得刷新的行对象
var trobj=document.getElementById("1");
//修改对象值, cslls(*)表示取得行中的第几个元素(第几列)"*"中的*从0开始
//trobj.cells(1).innerHTML="风调雨顺"+i;
trobj.cells(1).innerText="很好,很强大"+i;
i++;
}

//设置页面刷新时间函数
function change(){
var temp = document.getElementById("t").value;
if(temp <= 0){
//设置成默认的刷新时间为5秒
time=5000;
}else{
time = temp * 1000;
}
alert(time);

}

</script>
<body>
<p>本程序,在指定表格内使用AJAX,每5秒无闪动更新表格中“风调雨顺” </p>
<form action="#" name="post">
<table id="news" cellspacing="2" cellpadding="2" align="center" border="2" bgcolor="#c0c0c0">
<tr><td>设置刷新时间</td>
<td><input type="text" id="t" οnchange="change();"></td>
</tr>
<tr>
<th width="15%">名称</th>
<th width="55%">内容</th>
</tr>
<tr id="1">
<td>中国</td>
<td style="color:red;">很好,很强大</td>
</tr>
<tr id="2">
<td>国外</td>
<td>很好</td>
</tr>
<tr id="3">
<td>亚洲</td>
<td>风景这边最好</td>
</tr>
</table>
</form>
</body>
</html>
今天在浏览javaeye论坛时,看见一个关于dwr无闪动刷新的例子,向这样的方法可以应用于一些重要实时数据显示的页面。特在此转载,收藏于此。在此向原创者致意!
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值