为什么clearInterval只能使用一次？

我有这样的例子：“停止时间”为什么clearInterval只能使用一次？

<p id="test"></p> 

<button onClick="clearInterval(myVar)">Stop time!</button> 
<button onClick="setInterval(myTimer, 1000)">Start time!</button> 

<script> 

var myVar = setInterval(myTimer, 1000); 

function myTimer() { 
    var d = new Date(); 
    document.getElementById('test').innerHTML = d.toLocaleTimeString(); 
} 

</script>

当我点击这是第一次，它应该如此，但我点击“开始时间！”后我无法停止计时器了。为什么会发生这种情况以及如何解决这个问题？

谢谢。

来源

2016-06-07 super11

看看这段代码

<button onClick="setInterval(myTimer, 1000)">Start time!</button>

它不工作，因为你不设置新的计时器给变量。它不知道应该在那里设置新值。

不是内嵌代码的粉丝，但这样的工作

<button onClick="myVar = setInterval(myTimer, 1000)">Start time!</button>

一个更好的设计是这样的：

(function() { 
 

 
    var timer; 
 

 
    function myTimer() { 
 
    var d = new Date(); 
 
    document.getElementById('test').innerHTML = d.toLocaleTimeString(); 
 
    } 
 

 
    function startTimer() { 
 
    stopTimer(); //make sure timer is not already running 
 
    timer = setInterval(myTimer, 1000); //start new timer 
 
    } 
 

 
    function stopTimer() { 
 
    if (timer) clearInterval(timer); 
 
    timer = null; 
 
    } 
 

 
    document.getElementById("stop").addEventListener("click", stopTimer); 
 
    document.getElementById("start").addEventListener("click", startTimer); 
 

 
    startTimer(); 
 

 
}());

<p id="test"></p> 
 

 
<button id="stop">Stop time!</button> 
 
<button id="start">Start time!</button>

来源

2016-06-07 11:53:48 epascarello

我不明白为什么只给一个变量赋值。它是否有变量，为什么？ – super11

因为原始变量保存了返回的区间ID。设置新的时间间隔与您调用它的原始时间没有任何关系。 – epascarello

变量与任何事物无关。这里没有关系。 setInterval返回一个数字标识，表示对该间隔的引用。 JavaScript引擎不知道你在回归的时间间隔中做了什么。你可以存储它（就像你用myVar做的一样），或者你可以忽略它（就像你用onclick做的那样）。与调用方法并使其生成一个id没有任何关系。您可以调用相同的时间间隔100次，并且它们都会生成一个ID，并且这些时间间隔中的任何一个都不会与另一个时间间隔相关联。他们都是分开的。 – epascarello

试试这个..

<p id="test"></p> 

<button onClick="clearInterval(myVar)">Stop time!</button> 
<button onClick="startTimer()">Start time!</button> 
<script> 
var myVar; 

function startTimer() { 

    myVar = setInterval(myTimer, 1000); 
} 

function myTimer() { 
    var d = new Date(); 
    document.getElementById('test').innerHTML = d.toLocaleTimeString(); 
} 
</script>

来源

2016-06-07 12:09:01

为什么clearInterval只能使用一次？

回答

相关问题