使用javascript的計時器

我想用java腳本實現計時器。我想用間隔變化來減少計時器。
示例。假設我的計時器從500開始。
我想要遞減定時器取決於水平，如
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

沒有時間變化。你爲什麼做這個？你可以只有一個計時器，設置一個初始值並檢查它的進展情況。 – ingyhere 2012-02-23 06:30:45

當然，您可以在計時器運行時修改速度，但它只需要是可變的。 – RobG 2012-02-23 06:42:20

@ ingyhere我正在做一個遊戲（測驗），其中對於每個問題，我想從500遞減計時器，因此對於每個問題我稱爲函數CreateTimer（）但因爲我打電話CreateTimer（）函數兩次，thrise等速度正在增加。我不明白爲什麼會發生這種情況，爲什麼計時器速度始終不一樣。 – 2012-02-23 06:42:31

幾點：

你已經使用了所有的全局變量，這是更好地讓他們的私人所以其他功能不惹他們
開始用captial信功能名稱，由約定，爲構造函數保留
分配給setTimeout的函數在運行時沒有任何公共變量或函數來修改速度，因此您只能使用全局變量來控制速度。這是確定的，如果你不關心別人與他們搞亂，而且更好地保持他們的私人
爲UpdateTimer的代碼沒有被列入
不是傳遞一個字符串的setTimeout的，傳遞一個函數引用：setTimeout(Tick, 1000);

總之，如果你想要一個簡單的定時器，你可以改變的速度：

<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>

它保持它在關閉所有變量所以只有該函數可以對其進行修改。您可以通過設置零速來暫停它。

來源

2012-02-23 07:08:55 RobG

ok謝謝你解決的問題我沒有使用clearInterval（）函數。 – 2012-02-23 10:31:48

希望，這可能是有益的：

<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的計時器

回答

相關問題