我有以下代码,用于启动和停止计时器。如果单击一次开始和停止,则效果很好。如果多次单击“开始”,如何停止“先前创建的” setInterval?
<html>
<head>
<script>
var myVar;
function myStartFunction() {
myVar = setInterval(function () {
myTimer();
}, 1000);
}
function myTimer() {
var d = new Date();
var t = d.toLocaleTimeString();
document.getElementById("demo").innerHTML = t;
}
function myStopFunction() {
clearInterval(myVar);
}
</script>
</head>
<body>
<p id="demo"></p>
<button onclick="myStopFunction()">Stop time</button>
<button onclick="myStartFunction()">Start time</button>
</body>
</html>
返回的值setInterval
称为计时器句柄。如果要能够多次调用“启动”并同时运行多个计时器,则需要将句柄保存在数组中。
因此,例如,如果您想“停止”以停止您启动的最后一个计时器:
var timers = [];
function myStartFunction() {
timers.push(setInterval(function () {
myTimer();
}, 1000));
}
function myTimer() {
var d = new Date();
var t = d.toLocaleTimeString();
document.getElementById("demo").innerHTML = t;
}
function myStopFunction() {
if (timers.length > 0) {
clearInterval(timers.pop());
}
}
旁注:您不需要中的匿名函数myStartFunction
,您可以直接使用myTimer
:
function myStartFunction() {
timers.push(setInterval(myTimer, 1000));
}
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句