Javascript 如何通过单击动态计时器来停止它们?
我有一个场景,我需要动态添加计时器。这意味着我需要显示数据库中没有记录的记录,并在末尾使用计时器。我已经完成了以下代码 JavaScript中的我的计时器函数 timer.jsJavascript 如何通过单击动态计时器来停止它们?,javascript,php,jquery,timer,Javascript,Php,Jquery,Timer,我有一个场景,我需要动态添加计时器。这意味着我需要显示数据库中没有记录的记录,并在末尾使用计时器。我已经完成了以下代码 JavaScript中的我的计时器函数 timer.js var Timer; var TotalSeconds; function CreateTimer(TimerID, Time){ var oop=this; this.Timer = document.getElementById(TimerID); this.TotalSeconds = T
var Timer;
var TotalSeconds;
function CreateTimer(TimerID, Time){
var oop=this;
this.Timer = document.getElementById(TimerID);
this.TotalSeconds = Time;
this.update();
oop.to=setTimeout(function(){ oop.tick(); }, 1000);
}
CreateTimer.prototype={
tick:function(){
var oop=this;
if (this.TotalSeconds <= 0){
return;
}
this.TotalSeconds -= 1;
this.update()
oop.to=setTimeout(function(){ oop.tick(); }, 1000);
},
update:function(){
var Seconds = this.TotalSeconds,Days = Math.floor(Seconds / 86400);
Seconds -= Days * 86400;
var Hours = Math.floor(Seconds / 3600);
Seconds -= Hours * (3600);
var Minutes = Math.floor(Seconds / 60);
Seconds -= Minutes * (60);
var TimeStr = ((Days > 0) ? Days + " days " : "") +
LeadingZero(Hours) + ":" + LeadingZero(Minutes) + ":" + LeadingZero(Seconds)
this.Timer.innerHTML = TimeStr;
},
stop:function(){
clearTimeout(this.to);
}
}
function LeadingZero(Time){
return (Time < 10) ? "0" + Time : + Time;
}
它只能正常工作。我想它是在显示计时器。我需要停止计时器,同时点击它。我不知道该怎么做
请帮我解决这个问题。如果这是您希望所有计时器都包含的功能,我会封装它。像这样:
//...
function CreateTimer(TimerID, Time){
var oop=this;
this.Timer = document.getElementById(TimerID);
// here. add Event listener to the DOM element
var self = this; //save self
this.timer.addEventListener('click', function() {
self.stop();
});
// ## end ##
this.TotalSeconds = Time;
this.update();
oop.to=setTimeout(function(){ oop.tick(); }, 1000);
}
//...
onclick事件,或单击某个id时触发的函数?@royalBg:我可以使用onclick事件。但在那里,我无法传递那个特定的计时器对象。其实我不知道。
{
// other codes
timer+i = new CreateTimer('timer'+i, 60);
}
//...
function CreateTimer(TimerID, Time){
var oop=this;
this.Timer = document.getElementById(TimerID);
// here. add Event listener to the DOM element
var self = this; //save self
this.timer.addEventListener('click', function() {
self.stop();
});
// ## end ##
this.TotalSeconds = Time;
this.update();
oop.to=setTimeout(function(){ oop.tick(); }, 1000);
}
//...