javascript_javascript スキルで 2 回の連続したボタンのクリック間の時間間隔を設定する方法

この記事の例では、JavaScript を使用してボタンを 2 回連続してクリックする間隔を設定する方法を説明します。ご参考までに。具体的な実装方法は以下の通りです。

実際のアプリケーションでは、ボタンを連続的にクリックしたくない場合が多いため、ボタンが再度クリックされるまでの一定の時間を制限する必要があります。以下は、この機能の実装方法を紹介するコード例です。コードは次のとおりです:

コードをコピー コードは次のとおりです。

<メタ文字セット="utf-8"> <スクリプトタイプ="text/javascript"> window.onload=function(){ var odiv=document.getElementById("thediv"); var obt=document.getElementById("bt"); 変数カウント=0; var flag=null; 関数完了(){
If(count==0){
クリア間隔 (フラグ)
}
他{
カウント=カウント-1; }
}
obt.onclick=function(){
var val=parseInt(odiv.innerHTML); If(count==0){
odiv.innerHTML=val 1; カウント=20; Flag=setInterval(完了,1000); }
他{
alert("クリックするまでに" (count) "秒かかります"); }
}
}

0

上記のコードは私たちの要件を実現しており、ボタンをクリックする間隔を制限できます。この効果は、投稿間の間隔の制限など、他の機能にも拡張できます。以下はその実装プロセスの概要です。

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

1.window.onload=function(){}。これは、ドキュメントのコンテンツが完全にロードされた後に関数内のコードが実行されることを規定します。
2.var odiv=document.getElementById("thediv")、div 要素オブジェクトを取得します。
3.var obt=document.getElementById("bt")、ボタンオブジェクトを取得します。
4.var count=0、変数を宣言し、インターバル時間を格納するために使用される初期値を 0 に代入します。
5.var flag=null、変数を宣言し、初期値を null に代入します。この変数は、タイマー関数の戻り値を格納するために使用されます。
6.関数done(){}。この関数はタイマー関数によって継続的に呼び出され、カウントをデクリメントできます。
7.if(count==0){clearInterval(flag);}、count==0の場合、タイマー関数の実行を停止します。
8.else{count=count-1;}、0 に等しくない場合は、減算演算を実行します。
9.obt.onclick=function(){} で、ボタンのクリックイベント処理関数を登録します。

10.var val=parseInt(odiv.innerHTML)、div 内のコンテンツを取得し、整数に変換します。 11.if(カウント==0){

odiv.innerHTML=val 1;

count=20;

flag=setInterval(done,1000);

}

カウントが 0 の場合は、div の内容を 1 に追加し、カウントを 20 に設定し、同時にタイマー関数の実行を開始します。
12.else{alert("クリックするまでにまだ時間がかかります" (count) "秒");}、count が 0 に等しくない場合、ポップアップがクリックされるまでにどれくらいの時間がかかります。

この記事が皆様の JavaScript プログラミング設計に役立つことを願っています。