上一篇文章提到列表定时器,后来在开发中,项目中增加了 延时功能。
问题来了
我如何对已经运行的Timer 进行管理呢
思路:初始化,循环实体对象的时候,动态创建n个Timer
当某个属性的值变化时,就将对应的Timer 清除,重新创建一个Timer
下面看看,我改进的Timer
function Timer_V1(itemid, timeridname){
if(eval("boo"+ itemid +"==false")){
var temp = $('#TotalSeconds'+ itemid).val();
eval("maxtime"+ itemid +"="+temp)
eval("boo"+ itemid +"=true")
}
if(eval("maxtime"+ itemid +">0")){
var _days = eval("maxtime"+ itemid +"/(3600 * 24)");
days= Math.floor(_days);
var _hours = eval("(maxtime"+ itemid +" - "+ days +" * 3600 * 24) / 3600");
hours= Math.floor(_hours);
var _minutes = eval("((maxtime"+ itemid +" - "+ days +" * 3600 * 24) - "+ hours +" * 3600) / 60");
minutes= Math.floor(_minutes);
var _seconds = eval("maxtime"+ itemid +" % 60")
seconds= Math.floor(_seconds);
msg="Time Left:"+days+"d "+hours+"h "+minutes+"m "+ seconds +"s ";//动态显示剩余时间。
$('#time_show'+ itemid).html(msg);
eval("maxtime"+ itemid +"--");
}
else{
eval("clearInterval("+ timeridname +")");
$('#time_show'+ itemid).html('Deal Over!');
PartRefresh_Inactive(itemid);
}
}
<script src="@Url.Content("~/Scripts/countdown_Auction1.0.js")"></script> //界面引用
<div class="row">
@foreach (var item in Model.OrderBy(m => m.ActualEndTime))
{
<div class="col-xs-3" style="margin-top:10px;margin-left:5px">
<div class="container time-item" style="text-align:center">
<strong id=@("time_show" + item.ItemID)></strong>
<input type="hidden" id=@("ActualEndTime" + item.ItemID) value="@item.ActualEndTimeStr" /> //记录最新的结束时间
<input type="hidden" id=@("TotalSeconds" + item.ItemID) value="@item.TotalSeconds" /> //从服务器取来的总秒数
</div>
<!--动态创建Timer-->
<script type="text/javascript">
var [email protected];
eval("var maxtime" + itemid + "=0");
eval("var timer" + itemid + ";");
eval("var boo" + itemid + "=false;");
eval("timer" + itemid + "=setInterval(\"Timer_V1(" + itemid + ",timer" + itemid+")\",1000);");
</script>
<div>
}
</div>
<script type="text/javascript">
//修改列表的CurrentPrice
function ChangeData(jsonData) {
var obj = $.parseJSON(jsonData);
var itemid=obj.ItemID;
var ActualEndTime_Orion = $("#ActualEndTime" + itemid).val();
var ActualEndTime_New = obj.ActualEndTimeStr;
if (ActualEndTime_Orion != ActualEndTime_New) {
//清除定时器
eval(" window.clearInterval(timer"+itemid+")");
//重置定时器
$('#TotalSeconds' + itemid).val(obj.TotalSeconds);
eval("boo" + itemid + "=false;");
eval("timer" + itemid + "=setInterval(\"Timer_V1(" + itemid + ",timer" + itemid+")\",1000);");
//记录最新的时间
$("#ActualEndTime" + itemid).val(ActualEndTime_New);
}
}