JSP页面如何实现无操作实时刷新?

JavaScript013

JSP页面如何实现无操作实时刷新?,第1张

页面的这种无操作实时刷新，一般是首先页面一加载完毕就去后台请求一次数据，显示在页面上。然后在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()方法，这样就陷入了死循环，一直处于请求然后刷新的状态。

为了解决这样的问题，我们使用下面这种方式：

利用以上方法，在每次进入这个页面的时候，都会绕过浏览器缓存，重新向服务器获取数据。