ここから本文です

タイマーリセットについて

k1pieceさん

2013/2/616:00:10

タイマーリセットについて

以下のソースでスタートボタンを押すと
タイマーが減って0になるとメッセージを出すことができました。

あともう一つ
一定条件を満たすとタイマーがリセットされるというのを作りたいです。

<例>
ノルマを0以下にするとタイマーがリセットされる

よろしくお願いします


<html lang="ja">
<head><title>sample</title>
<meta http-equiv="Content-Style-Type" content="text/css">
<meta http-equiv="Content-Script-Type" content="text/javascript">

<script type="text/javascript">
var Timer = (function(){
var timer = function(id){
this.timerId = null,
this.callback = null,
this.baseTime = 0,
this.time = 0,
this.target = document.getElementById(id);
}

var disp = function(){
var msec = this.time>0? this.time: 0;
this.target.innerHTML = (msec/1000 + 0.5 | 0);
}

timer.prototype = {
start : function(time, func){
if(!this.callback){
this.time = (time || 0) * 1000;
this.callback = func || new Function();
}
this.baseTime = +(new Date()) + this.time;
disp.call(this);
var obj = this;
this.timerId = setInterval(function(){
obj.time = obj.baseTime - new Date();
disp.call(obj);
if(obj.time<=0){
var f = obj.callback;
obj.reset();
if(typeof f === "function") f();
}
}, 200);
},

stop : function(){
clearInterval(this.timerId);
},

reset : function(){
this.stop();
this.timerId = null;
this.callback = null;
this.time = 0;
disp.call(this);
}
}

return function(id){ return new timer(id); }

})();
</script>
</head>

<body>
<div id="test" style="font-size:3em;">0</div>

<div>
<input type="button" value="start" onclick="test.start(20, function(){alert('TIME UP!');})">
<input type="button" value="pause" onclick="test.stop()">
<input type="button" value="reset" onclick="test.reset()">
</div>

<script>
var test = Timer("test");
</script>
</body>
</html>

閲覧数:
269
回答数:
2
お礼:
100枚

違反報告

ベストアンサーに選ばれた回答

rishorusさん

2013/2/801:56:03

「一定条件を満たしたとき」に test.stop() を呼び出すだけです。


ついでながら、

> if(typeof f === "function") f();

は if(typeof f === "function") f.call(obj); の方が良いでしょう。いろんな意味で。

それとたぶん、元コードには冒頭に <!DOCTYPE html> があったのではないですか。これを削ってはいけません。

質問した人からのコメント

2013/2/8 09:40:23

感謝 <!DOCTYPE html>
付け忘れてました。

ありがとうございます。

ベストアンサー以外の回答

1〜1件/1件中

2013/2/616:45:28

カテゴリー違いじゃないですか?回答は来ませんよおそらく。

あわせて知りたい

みんなで作る知恵袋 悩みや疑問、なんでも気軽にきいちゃおう!

5文字以上入力してください

Q&Aをキーワードで検索:

Yahoo! JAPANは、回答に記載された内容の信ぴょう性、正確性を保証しておりません。
お客様自身の責任と判断で、ご利用ください。
本文はここまでです このページの先頭へ

「追加する」ボタンを押してください。

閉じる

※知恵コレクションに追加された質問は選択されたID/ニックネームのMy知恵袋で確認できます。