爲什麼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只能使用一次？

回答

相關問題