JavaScript timer_javascript スキルの詳しい説明と例-jsチュートリアル-php.cn

JS での遅延の設定: SetInterval の使用は、遅延関数 setTimeout の設定と非常に似ています。 setTimeout は、操作を実行する前に一定期間遅延させるために使用されます。 setTimeout("function",time) はタイムアウト オブジェクトを設定します。 setInterval("function",time) はタイムアウト オブジェクトを設定します。 SetInterval は自動的に繰り返され、setTimeout は繰り返されません。 clearTimeout(object) は setTimeout オブジェクトをクリアします clearInterval(object) は setInterval オブジェクトをクリアします タイマーを使用して JavaScript の遅延実行または繰り返し実行を実装します ウィンドウ オブジェクトには 2 つのメソッドが用意されています。タイマーの場合、それらはそれぞれ window.setTimeout() と window.setInterval です。前者は指定された時間の後にコードを実行できますが、後者は指定された時間ごとにコードを 1 回実行できます。それらのプロトタイプは次のとおりです: window.setTimeout(expression,milliseconds); window.setInterval(expression,milliseconds); その中で、expression は引用符で囲まれたコードの一部にすることができます。関数名を指定すると、システムは指定された時刻に関数を自動的に呼び出します。関数名を呼び出しハンドルとして使用する場合は、パラメーターを受け取ることはできません。文字列を使用する場合は、その関数に渡すパラメーターを記述することができます。 2 つのメソッドの 2 番目のパラメーターはミリ秒で、遅延または繰り返し実行のミリ秒数を表します。以下に 2 つの方法を紹介します。 1． window.setTimeout メソッド このメソッドは関数の実行を遅らせることができます。例:

コードをコピー コードは次のとおりです。 function hello(){ alert(" hello"); } window.setTimeout(hello,5000); //--> このコードはページを 5 秒間開きます。数秒後、「こんにちは」というダイアログ ボックスが表示されます。最後の文は次のように書くこともできます: コードをコピー コードは次のとおりです: window.setTimeout( "hello()",5000); このプロパティは window.setInterval メソッドにも存在します。 遅延期間に達する前に遅延実行をキャンセルする場合は、タイマーを表す ID を受け取る window.clearTimeout(timeoutId) メソッドを使用できます。この ID は、setTimeout メソッドによって返されます。例: コードをコピー コードは次のとおりです: function hello(){ alert("hello"); var id=window.setTimeout(hello,5000); document.onclick=function(){ window.clearTimeout(id); //->

このように、ページの任意の部分をクリックするだけで window.clearTimeout メソッドが実行されます。タイムアウト操作がキャンセルされます。 2． window.setInterval メソッド このメソッドは、一定時間ごとに関数を呼び出す、非常に一般的なメソッドです。スケジュールされた実行をキャンセルする場合は、clearTimeout メソッドと同様に、window.clearInterval メソッドを呼び出すことができます。また、clearInterval メソッドは、setInterval メソッドによって返された値をパラメータとして受け取ります。例:

コードをコピー コードは次のとおりです: //次の呼び出しを定義します。繰り返し実行されます var id=window.setInterval("somefunction",10000); //スケジュールされた実行をキャンセルします window.clearInterval(id);

上記のコードは、スケジュールされた実行をキャンセルする方法を説明するためにのみ使用されます。実際、setInterval メソッドは多くの場合に使用する必要があります。以下では、setInterval 関数の使用方法を紹介するストップウォッチを設計します。ストップウォッチには、時間を表示するための 2 つのボタンとテキスト ボックスが含まれます。スタートボタンをクリックすると計測が開始され、最小単位は0.01秒です。再度ボタンをクリックすると計測が停止し、テキストボックスに経過時間が表示されます。別のボタンを使用して、現在時刻をゼロにリセットします。実装コードは次のとおりです:

コードをコピー コードは次のとおりです: 新しいドキュメント "0" name="txt1"/> //フォーム内のフォームフィールドを取得します var txt=document.forms[0].elements["txt1"]; var btnStart= document .forms[0].elements["btnStart"]; var btnReset=document.forms[0].elements["btnReset"] //タイマーの ID を定義します var id; //値は 10 ミリ秒ごとに 1 ずつ増加します var seed=0; btnStart.onclick=function(){ //ボタンのテキストに基づいて現在の操作を判断します if （this.value = = "start"）{ >} //リセットボタン btnReset.onclick=function(){ シード=0; } //ストップウォッチを 1 フレームジャンプさせます functiontip(){ シード ; txt.value=seed/100; } //->

7.4.3 パスタイマー呼び出しのパラメータ window.setTimeout であっても window.setInterval であっても、関数名を呼び出しハンドルとして使用する場合はパラメータを受け取ることができないため、解決する方法を見つける必要があります。それ。たとえば、関数 hello(_name) の場合、ユーザー名のウェルカム メッセージを表示するために使用されます。

コードをコピー

コードは次のとおりです:

var username = "jack"; // ユーザー名に従ってウェルカム情報を表示します Function Hello (_name) { Alert (" Hello," _Name); }

現時点では、次のステートメントを使用して hello 関数の実行を 3 秒遅らせることは現実的ではありません:

コードをコピーします コードは次のとおりです。 window.setTimeout(hello(userName),3000); これにより、hello 関数がすぐに実行され、値が返されます。呼び出しハンドルが setTimeout 関数に渡されると、結果はプログラムが必要とするものではありません。文字列形式を使用すると、目的の結果を得ることができます:

コードをコピーします

コードは次のとおりです: window.setTimeout("hello(userName)",3000); ここでの文字列は JavaScript コードの一部であり、userName は変数を表します。ただし、この書き方は直感的ではなく、場合によっては関数名を使用する必要があります。パラメータを使用して関数を呼び出すには、次のようなちょっとしたトリックがあります。

コードをコピー

コードは次のとおりです: var userName="jack" //ユーザーに基づいて表示しますname ウェルカムメッセージ function hello(_name){ alert("hello," _name); } //パラメータのない関数を返す関数を作成します function _hello(_name ;

関数 _hello が定義されており、パラメーターを受け取り、パラメーターなしで関数を返すために使用されます。したがって、パラメーターを使用せずに呼び出します。 window.setTimeout 関数では、_hello(userName) を使用してパラメータなしで関数ハンドルを返すことで、パラメータを渡す関数を実現します。 ウィンドウ オブジェクトには、setTimeout と setInteval という 2 つの主要なタイミング メソッドがあります。それらの構文は基本的に同じですが、完成した関数が異なります。 setTimeout メソッドは、一定時間後に何をするかを指定するタイミング プログラムです。完了したら下に引き下げます。 setIntervalメソッドとは、一定の間隔で繰り返し操作を行うことを意味します。 JS で遅延を設定する: SetInterval の使用は、遅延関数 setTimeout の設定と非常に似ています。 setTimeout は、操作を実行する前に一定期間遅延させるために使用されます。 setTimeout("function",time) はタイムアウト オブジェクトを設定します。 setInterval("function",time) はタイムアウト オブジェクトを設定します。 SetInterval は自動的に繰り返され、setTimeout は繰り返されません。 clearTimeout(object) は setTimeout オブジェクトをクリアします clearInterval(object) は setInterval オブジェクトをクリアします setTimeout を使用して setInerval 関数を実装する場合は、実行中のプログラムで定期的に自分自身を呼び出す必要があります。カウンタをクリアしたい場合は、使用するメソッドに応じてさまざまなクリア メソッドを呼び出す必要があります。 例:

コードをコピーします

コードは次のとおりです: tttt=setTimeout('northsnow()',1000) または:

コードをコピー

コードは次のとおりです: tttt=setInterval('northsnow() ',1000); clearInteval(tttt) ; コードをコピーします:

コードは次のとおりです:

スクリプト言語="javascript"> var intvalue=1; var timer2=null; { liujincai.innerHTML=liujincai.innerHTML " " (intvalue) .toString(); timer2=window.setTimeout("startShow ()",2000); 関数 stop() { window.clearTimeout(timer2); > }

または:

コードをコピー

コードは次のように:

var intvalue=1; var timer2=null; function startShow() { liujincai .innerHTML=liujincai.innerHTML " " (intvalue ).toString(); } 関数 stop() { window.clearInterval(timer2) ; /script>