javascriptタイマーイベント使用詳細

5213 ワード

JavaScritpでは、タイミングイベントを使用することが容易であり、二つの鍵となる方法は:
set Timeout()は、将来のいつかコードclearTimeout()を実行します.setTimeout()setTimeout()文法をキャンセルします.

 
  
var t=setTimeout("javascript  ",  )

set Timeout()メソッドは、ある値を返します.上記のステートメントでは、値はtという変数に格納されます.このsetTimeoutをキャンセルしたい場合は、この変数を使って名来で指定できます.
set Timeout()の最初のパラメータはJavaScript文を含む文字列である.このステートメントは、例えば「alert('5 seconds!')」や、alertMsg()「などの関数への呼び出しのようなものがあります.
第二のパラメータは、現在から何ミリ秒後に第一のパラメータを実行するかを示します.
ヒント:1000ミリ秒は一秒に等しい.
この例のボタンをクリックすると、ヒントボックスが5秒後に表示されます.

 
  
 
  
 
  
 
  <br>function timedMsg() 
  <br> { 
  <br> var t=setTimeout("alert('5 seconds!')",5000) 
  <br> } 
  <br>

実例-無限ループ
無限ループで動作するタイマーを作成するには、関数を作成して自身を呼び出す必要があります.以下の例では、ボタンをクリックすると、入力領域は0から数え始めます.

 
  
 
   
  
<br>var c=0<br>var t<br>function timedCount()<br> {<br> document.getElementById('txt').value=c<br> c=c+1<br> t=setTimeout("timedCount()",1000)<br> }<br>

clearTimeout()
構文

 
  
clearTimeout(setTimeout_variable)

実例
以下の例は上記の無限ループの例と似ています.唯一の違いは、現在「Stop Count」を追加しました.ボタンを押してこのカウンタを停止します.

 
  
 
   
  
<br>var c=0<br>var t</p> 
  <p>function timedCount()<br> {<br> document.getElementById('txt').value=c<br> c=c+1<br> t=setTimeout("timedCount()",1000)<br> }</p> 
  <p>function stopCount()<br> {<br> clearTimeout(t)<br> }<br>

他の2つの重要な方法:

 
  
setInterval() 
  
setInterval() - executes a function, over and over again, at specified time intervals

作用は:循環して1つの方法を実行して、規定の間隔の時間の内で
構文:

 
  
window.setInterval("javascript function",milliseconds);

説明:最初のパラメータは関数でなければなりません.2番目のパラメータは実行関数の間隔時間です.
例:

 
  
 
  
 
  <br>setInterval(function() {alert("hello")},500); 
  <br>

説明:上記の例では、実行効果は500 msごとにalertとなります.
もう一つの時計:

 
  
 
  
 
  
 
  
 
  <br>setInterval(function(){ myTimer()},1000); 
  <br>        function  myTimer(){ 
  <br>                var d = new Date(); 
  <br>                var t=d.toLocaleTimeString(); 
  <br>                document.getElementById('demo').innerHTML=t; 
  <br>        } 
  <br>

如何停止,setInterval()方法??

 
  
window.clearInterval()

構文:

 
  
window.clearInterval(intervalVariable)

 
  
The window.clearInterval() method can be written without the window prefix. 
   
  To be able to use the clearInterval() method, you must use a global variable when creating the interval method: 
  myVar=setInterval("javascript function",milliseconds);
Then you will be able to stop the execution by calling the clearInterval() method.

例:

 
  
 
  
 
  
 
  
stop 
  
 
  <br>var temp=setInterval(function(){ myTimer()},1000); 
  <br>        function  myTimer(){ 
  <br>                var d = new Date(); 
  <br>                var t=d.toLocaleTimeString(); 
  <br>                document.getElementById('demo').innerHTML=t; 
  <br>        } 
  <br>function stop(){ 
  <br>   <html> 
  <br><body> 
  <br><p id="demo" ></p> 
  <br><p id="demo2" onclick="stop()">stop</p> 
  <br><script type="text/javascript"> 
  <br>var temp=setInterval(function(){ myTimer()},1000); 
  <br>        function  myTimer(){ 
  <br>                var d = new Date(); 
  <br>                var t=d.toLocaleTimeString(); 
  <br>                document.getElementById('demo').innerHTML=t; 
  <br>        } 
  <br>function stop(){ 
  <br>        clearInterval(temp); 
  <br>} 
  <br> 
  
 
  
 
   
  }

JavaScriptタイプの判断