页面的这种无操作实时刷新,一般是首先页面一加载完毕就去后台请求一次数据,显示在页面上。然后在jsp页面上通过js的定时调用ajax方法每隔固定的时间去后台请求数据刷新页面。
<script type="text/javascript">var reftime = 10000//默认每隔10秒向后台发送请求
var taskId
//页面加载完毕调用此函数
function myStart(){
loadData()
taskId = setInterval(loadData,reftime)//每隔reftime调用loadData方法刷新页面
}
function loadData(){
$.ajax({
type: "POST",
url: "<%=path%>/three",
dataType: "xml",
data:{"data",""},
success: function(returnedData){
//请求成功将数据更新页面即可。
}
})
}
function setref(){
var timeValue = document.getElementById('miss').value
if(timeValue == "" || isNaN(timeValue)){
alert("参数设置有误")
}else if(timeValue < 10 || timeValue > 60){
alert("参数设置有误")
}else{
alert("刷新频率成功更新为" + timeValue + "秒")
reftime = timeValue * 1000
clearTimeout(taskId)
page = 1
myStart()
}
}
</script>
js页面刷新
让页面进行刷新,可以使用 location.reload() 方法,但是这种方法会让页面一直不断的刷新。
这是因为当页面加载完成以后,我们让它刷新一次,那么浏览器就会重新向服务器请求数据,界面会重新加载,然后,加载完成又调用了location.reload()方法,这样就陷入了死循环,一直处于请求然后刷新的状态。
为了解决这样的问题,我们使用下面这种方式:
利用以上方法,在每次进入这个页面的时候,都会绕过浏览器缓存,重新向服务器获取数据。