為什么不可以停止?
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>計時器</title>
<script type="text/javascript">
? ?function clock(){
? ? ? var time=new Date();? ? ? ? ? ? ? ? ??
? ? ? document.getElementById("clock").value = time;
? ?}
? ? ?var i =setInterval(clock,1000);
</script>
</head>
<body>
? <form>
? ? <input type="text" id="clock" size="50"? />
? ? <input type="button" value="Stop" onclick="clearInterval(i)" />
? </form>
</body>
</html>
2018-01-21
親測,是慕課網的網頁問題。將代碼復制下來,然后放在test.html文件中
然后用任意瀏覽器打開,stop功能是正常的。
2017-10-22
贊同樓上的說法,應該和慕課網的驗證機制有關,我將代碼復制進JSbin里面運行,就沒有發現這個不能停止的問題。
2017-10-18
補充:(在未刷新頁面的情況下)每次提交后,setInterval()的返回值會累加,但每次只是生成兩個計時器(i和i-1),因此function stop()中寫成?
{
clearInterval(i);?
clearInterval(i-1);
}
比較恰當; ? ? ?
2017-10-18
分享一下自己debug的經歷:
我最開始也遇到了和你一樣的問題,無論是把clearInterval(i)寫在onclick里,還是封裝在function里都無法停止。
后來通過查看setInterval()的返回值發現,返回值從1開始自增(你可以通過點擊自動運行按鈕發現),但每次提交后,得到的結果是2 4 6...,因此是每次提交后都會出現兩個計時器(可能和慕課網的提交機制有關),也就是說,你調用了clearInterval(i)只關閉了一個計時器,還有前一個計時器在調用clock函數。
例:在setInterval()方法下寫一行document.write("id:"+i);第一次提交后頁面打印出id=2;此時你clearInterval(i)關閉了返回值為2的計時器,但事實是有返回值為1的計時器生成了.為了能關閉到所有計時器,我寫了一個for循環,遍歷關閉返回值從1到i的計時器,同時用一個函數封裝起來讓Stop按鈕調用,然后你會發現確實停止了
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>計時器</title>
<script type="text/javascript">
? ?function clock(){
? ? ? var time=new Date(); ? ? ? ? ? ? ? ?
? ? ? document.getElementById("clock").value = time;
? ?}
? ? var i = setInterval("clock()",1000);?
? ??
? ? document.write("id:"+i);
? ? function stop(){
? ? ? ? for(var j =1;j<=i;j++){
? ? ? ? clearInterval(j); ??
? ? ? ? }
? ? }
</script>
</head>
<body>
? <form>
? ? <input type="text" id="clock" size="50" ?/>
? ? <input type="button" value="Stop" onclick="stop()" ?/>
? </form>
</body>
</html>
結論:個人認為這跟慕課網提交按鈕的實現有關系(學習前面課程同時打開過兩個新窗口的同學舉手?)
2017-10-09
代碼是沒有問題的,可能是瀏覽器的問題,你提交后刷新一下再試試,提交后內容是保存的!
2017-10-07
你根本就沒有停止定時器啊,要加
clearInterval(i)
才停的