javascript：カウントダウンタイマーの止め方について

JavaScriptのカウントダウンタイマーを作っています。setIntervalを使っているのですが、clearIntervalで止まりません。HTMLとは別のファイルに作っています。タイマーのid名はetimeです。

該当のソースコード

Javascript
1// タイマーの開始時刻set
2var start = new Date();
3var prev = start.getSeconds();
4window.onload = function() 
5{// タイマー etime のデータ書き換え
6 node_etime = document.getElementById('etime');
7 node_etime.style.fontSize = '8em';
8 put_time(node_etime);
9 setInterval('put_time(node_etime)', 1000);
10 if (ss<=0)clearInterval("etime",1000);
11 // タイマーのrestartボタン押下時ハンドラの登録
12 document.getElementById('restart').onclick = function() { start = new  Date(); }};
13// etime用
14// 経過時間を計算して、文字列として構築する
15function put_time(node)
16{var curr = new Date();			
17 var s = curr.getSeconds();	
18 if (s == prev) return;	        // sの数値がprevと同じなら何も処理せず戻る
19prev=s;									// prevをsに更新（代入）
20 // 現在時刻currと開始時刻startの差を計算し（単位はミリ秒）、
21 // 秒単位に変換するため、1000で割り、整数部分のみを取り出す
22 var e = Math.floor(22+(start - curr) / 1000);	// eは経過秒数
23 var ss = e % 60;						// ssにeの分未満の部分を取り出す
24 e = Math.floor(e/60);				// eを分単位（整数）に変換
25 var mm = e % 60;						// mm にeの時間未満の部分を取り出す
26 e = Math.floor(e/60);				// eを時間単位（整数）に変換
27 var hh = e;									// hh にe（時間部分）を設定
28var em_s = em_e = '';
29if (ss<=10)
30 {em_e='</em>';
31  node.style.color='red';} //10s前に赤くなる
32 else
33 {node.style.color = '#000000';}
34 // hh:mm:ss 形式でnode内のHTMLを書き換え
35 node.innerHTML = em_s+two_digit(hh)+':'+two_digit(mm)+':'+two_digit(ss)+em_e;}
36// 数値が1桁（0～9）なら、頭に'0'を付け足した文字列を返す関数
37function two_digit(d)
38{if (d < 10) return '0'+d;
39 return d;}

カウントアップタイマーの見本コードを元にカウントダウンタイマーを作っています。clearIntervalの位置をいろいろ動かしてみましたが上手くいきません。やり方の検索もしましたが同じように作っている人がおらず困っています。修正案でなくても何か気づいたことがあれば教えていただきたいです。よろしくお願いいたします。

行動規範の内容に同意します

回答3件

setIntervalの処理を変数に入れて
cleaIntervalの引数に入れて使う方法ならわかります
基本を載せておきますので良ければ参考に使ってください

js
1	var start;
2    // スタート処理
3	start = setInterval('put_time(node_etime)',1000);
4
5	// 停止処理
6	clearInterval(start);

条件で停止の場合

js
1	// 停止処理
2	if (ss <= 0) {
3		clearInterval(start);
4	}
5

投稿2018/10/28 08:52

編集2018/10/28 08:55

akihiro3

総合スコア955

自己解決

// タイマーの開始時刻set
var start = new Date();
var prev = start.getSeconds();
window.onload = function()
{// タイマー etime のデータ書き換え
node_etime = document.getElementById('etime');
node_etime.style.fontSize = '8em';
put_time(node_etime);
setInterval('put_time(node_etime)', 1000);
~~if (ss<=0)clearInterval("etime",1000);~~
// タイマーのrestartボタン押下時ハンドラの登録
document.getElementById('restart').onclick = function() { start = new Date(); }};
// etime用
// 経過時間を計算して、文字列として構築する
function put_time(node)
{var curr = new Date();
var s = curr.getSeconds();
if (s == prev) return;
prev=s;
// 現在時刻currと開始時刻startの差を計算し（単位はミリ秒）、
// 秒単位に変換するため、1000で割り、整数部分のみを取り出す
var e = Math.floor(22+(start - curr) / 1000); // eは経過秒数
var ss = e % 60; // ssにeの分未満の部分を取り出す
e = Math.floor(e/60); // eを分単位（整数）に変換
var mm = e % 60; // mm にeの時間未満の部分を取り出す
e = Math.floor(e/60); // eを時間単位（整数）に変換
var hh = e; // hh にe（時間部分）を設定