我正在使用MVC进行部分渲染和ajax调用。在我的一个结果表中,我有一个计时器字段。
以下代码位于我的部分视图中,每30秒渲染一次。其中一个字段是显示给用户的活动计时器:
<td><div id="@someID" class="nobutton"></div><script>setInterval(function () { startTimer('@startDateTime', '@someID') }, 500);</script></td>
这很好用但是在调用ajax调用部分之后,间隔函数仍在调用不再存在的旧ID(someID)。
以下是计时器的javascript:
<script type="text/javascript">
function startTime(dt, field){
var field = document.getElementById(field);
if (field == null)
return;
var rowTime = new Date(dt);
var rowTimems = rowTime.getTime(rowTime);
var currentTime = new Date();
var currentTimems = currentTime.getTime(currentTime);
var difference = currentTimems - rowTimems;
var hours = Math.floor(difference / 36e5),
minutes = Math.floor(difference % 36e5 / 60000),
seconds = Math.floor(difference % 60000 / 1000);
field.innerHTML = formatTime(hours) + ":" + formatTime(minutes) + ":" + formatTime(seconds);
</script>
主页面上刷新部分的调用非常简单:
var t = setInterval(function () {
$.ajax({
url: "MYURL",
type: "GET",
cache: false,
success: function (data) {
$("#summary").html(data);
}
});
}, 30000);
有没有办法杀死旧计时器?他们为什么还在运行?
答案 0 :(得分:2)
setInterval(function () { startTimer('@startDateTime', '@someID') }, 500);
将继续执行相同的值,直到用clearInterval()
清除它。要清除它,您需要将其保存var
并将其提供给clearInterval()
功能。
答案 1 :(得分:2)
代码仍在执行的原因是间隔从未停止过。在你的部分尝试这个。它将检查前一个间隔计时器是否存在并清除它。
<td><div id="@someID" class="nobutton"></div>
<script>
if( window.prtInt != void 0 ) clearInterval(window.prtInt);//void 0 means undefined
window.prtInt = setInterval(function () { startTimer('@startDateTime', '@someID') }, 500);
</script></td>
如果您希望清除整个页面上的所有计时器(可能有不良影响),那么您可以获得新计时器的整数,并循环到仍然存在的那个数字清除间隔。
<script>
function clrTimers(){
var clr = setTimeout(function(){},10);
for( var i = 0; i < clr; i++ ){
clearInterval(i);
}
}
</script>
如果你想跳过一些,那么如果你知道的话,可以用continue关键字包含它们。如
for( var i = 0; i < clr; i++ ){
if( i == t ) continue; //I believe t was your ajax interval variable
clearInterval(i);
}