javascriptを使用しているタイマ

私は、Javaスクリプトを使用してタイマを実装したいと考えています。間隔を変更してタイマを減らしたいと思います。
例。私のタイマーは500から始まります。
レベルに応じてデクリメントタイマーが必要です。
1.第1レベルのタイマーは1だけデクリメントする必要がありますが、デクリメントの速度は遅くなければなりません。
2.2ndレベルタイマ2により減少すべきであると減少速度は
3.3rdレベルタイマーが3及び減少速度によって減少べき媒体であるべきである私は、次のコード使用してタイマーを作成することができ
javascriptを使用しているタイマ

高速でなければならない：

<script type="text/javascript"> 
var Timer; 
var TotalSeconds; 
function CreateTimer(TimerID, Time) 
{ 
    TotalSeconds=Time; 
    Timer = document.getElementById(TimerID); 
    TotalSeconds = Time; 
    UpdateTimer(); 
    setTimeout("Tick()", 1000); 
} 

function Tick() { 
    TotalSeconds -= 10; 
    if (TotalSeconds>=1) 
    { 
     UpdateTimer(); 
     setTimeout("Tick()", 1000); 
    } 
    else 
    { 
     alert(" Time out "); 
     TotalSeconds=1; 
     Timer.innerHTML = 1; 
    } 
}

を

しかし、私は何度も呼び出すので、速度が制御されないようにこのCreateTimer（）関数を何度も呼びます。

出典

2012-02-23 sardar Coder

時間のバリエーションはありません。なぜあなたはこれをやっている？ 1つのタイマーを持つだけで、開始値を設定し、それがどのように進んでいるかを調べることができます。 – ingyhere

もちろん、タイマーの実行中に速度を変更することはできますが、それは単に可変である必要があります。 – RobG

@ ingyhere各質問について、私は関数のCreateTimer（）を呼び出したが、CreateTimer（）関数を2回呼び出すと、速度が上がっているので、質問ごとに500から減算タイマーが必要なゲーム（クイズ）を行っています。私はなぜこれがなぜタイマーの速度がいつも同じではないのが起こるのか理解していません。 –

カップル：

は、あなたはそれがで、そのほかの機能は、彼らとキャピタル・文字で始まる
関数名を台無しないプライベートそれらを維持している方が良いでしょう、すべてのグローバル変数を使用しましたコンベンションに予約されています
setTimeoutに割り当てられた関数には、実行中に速度を変更するためのパブリック変数または関数がありません。したがって、グローバル変数のみを使用して速度を制御できます。 setTimeout(Tick, 1000);

UpdateTimer

含まれていないプライベート

それらを保つためにあなたがそれらをいじって他の人を気にしない場合はOKですが、より良いです

<script> 

var timer = (function() { 
    var basePeriod = 1000; 
    var currentSpeed = 1; 
    var timerElement; 
    var timeoutRef; 
    var count = 0; 

    return { 
     start : function(speed, id) { 
     if (speed >= 0) { 
      currentSpeed = speed; 
     } 
     if (id) { 
      timerElement = document.getElementById(id); 
     } 
     timer.run(); 
     }, 

     run: function() { 
     if (timeoutRef) clearInterval(timeoutRef); 
     if (timerElement) { 
      timerElement.innerHTML = count; 
     } 
     if (currentSpeed) { 
      timeoutRef = setTimeout(timer.run, basePeriod/currentSpeed); 
     } 
     ++count; 
     }, 

     setSpeed: function(speed) { 
     currentSpeed = +speed; 
     timer.run(); 
     } 
    } 

}()); 

window.onload = function(){timer.start(10, 'timer');}; 

</script> 

<div id="timer"></div> 
<input id="i0"> 
<button onclick=" 
    timer.setSpeed(document.getElementById('i0').value); 
">Set new speed</button>

機能だけがそれらを変更することができますので、それは、クロージャ内のすべての変数を保持します：あなたはの速度を変更することができ、簡単なタイマーをしたい場合はとにかく、

。速度を0に設定すると、一時停止することができます。

出典

2012-02-23 07:08:55 RobG

okありがとうございます。私はclearInterval（）関数を使用していません。 –

希望、これが役に立つことができます

<html> 
<head> 
<script type="text/javascript"> 
function showAlert() 
{ 
var t=setTimeout("alertMsg()",5000); 
} 
function alertMsg() 
{ 
alert("Time up!!!"); 
} 
</script> 
</head> 

<body> 
<form> 
<input type="button" value="Start" onClick="timeMsg()" /> 
</form> 
</body> 

</html>

出典

2012-02-23 06:53:03 Virtual

Check this demo on jsFiddle.net.

HTML

<div id="divTimer">100</div> 
<div id="divDec">1</div> 
<div id="divSpeed">100</div> 

<input id="start" value=" Start " onclick="javaScript:start();" type="button" /> 
<input id="stop" value=" Stop " onclick="javaScript:stop();" type="button" /><br/> 

<input id="inc" value=" Increase " onclick="javaScript:increase();" type="button" /> 
<input id="dec" value=" Decrease " type="button" onclick="javaScript:decrease();"/>

はJavaScript

var handler; 

function start() { 
    handler = setInterval("decrementValue()", parseInt(document.getElementById('divSpeed').innerHTML, 10)); 
} 

function stop() { 
    clearInterval(handler); 
} 

function decrementValue() { 
    document.getElementById('divTimer').innerHTML = parseInt(document.getElementById('divTimer').innerHTML, 10) - parseInt(document.getElementById('divDec').innerHTML, 10); 
} 

function increase() { 
    document.getElementById('divDec').innerHTML = parseInt(document.getElementById('divDec').innerHTML, 10) + 1; 
    document.getElementById('divSpeed').innerHTML = parseInt(document.getElementById('divSpeed').innerHTML, 10) + 200; 
    stop(); 
    decrementValue(); 
    start(); 
} 

function decrease() { 
    document.getElementById('divDec').innerHTML = parseInt(document.getElementById('divDec').innerHTML, 10) - 1; 
    document.getElementById('divSpeed').innerHTML = parseInt(document.getElementById('divSpeed').innerHTML, 10) - 200; 
    stop(); 
    decrementValue(); 
    start(); 
}

希望、これはあなたが探しているものです。ポイントの

出典

2012-02-23 07:01:11

javascriptを使用しているタイマ

答えて

関連する問題