ホームページ > 記事 > ウェブフロントエンド > よく使用される 3 つの JS 時間応答
この記事では主に、よく使われる 3 つの JS タイム レスポンスを紹介します。これが非常に優れていると思います。編集者をフォローして見てみましょう
ここでは、よく使われる時間応答をいくつか紹介します。これらは使い方が簡単で、非常に効果的です。
1. キートリガー
この種のイベント応答は非常に一般的であり、最初から発生します。簡単な例を挙げると:
<!DOCTYPE html> <html> <head> <title>javascript</title> </head> <body> <p>点击确认查看日期</p> <button onclick="myFunction()">确认</button> <p id="demo"></p> <script> function myFunction() { document.getElementById("demo").innerHTML =Date(); } </script> </body>
このタイプのメソッドの核心は、onclick+関数名をボタンのラベルに追加して関数をトリガーすることです。
2. マウストリガーまたは Enter トリガー。
最初の方法の欠点は実際には非常に明白です。たとえば、データのバッチを処理する必要があり、入力ボックスが多数ある場合、各ボックスの後に確認キーを追加する必要がありますか?これはユーザー入力にとって非常に不合理であるため、フォームまたは複数の入力ボックスに入力するときに効果をトリガーするにはマウスまたは Enter キーを使用する方がはるかに効率的です。
<!DOCTYPE html> <html> <head> <title>javascript</title> </head> <body> <p>请输入下列表框</p> <label>表框一</label><input type="text" id="t1" onchange="myFunction()"/> <p id="demo1"></p> <script> function myFunction() { var x = document.getElementById("t1").value; document.getElementById("demo1").innerHTML="表格一的内容是"+x; } </script> </body>
中心となるのは、onchange を使用して入力ボックス内の関数を呼び出すことです。入力後、マウスで任意の場所をクリックするか、Enter キーを押して関数を呼び出します。さまざまな処理に応じてさまざまな効果が表示されます。
3. いつでもトリガー
実際の例では、Web ページでオンライン 16 進数変換を試すことができます。つまり、確認キーを押したり、Enter を押したりする必要はありません。いつでも行うことができます。紛失して、いつでも変換できます。携帯電話の電卓を含め、入力値をリアルタイムに計算します。
<!DOCTYPE html> <html> <head> <title>javascript</title> </head> <body> <p>请输入下列表框</p> <label>表框一</label><input type="text" id="t1" onKeyUp="myFunction()"/> <p id="demo1"></p> <script> function myFunction() { var x = document.getElementById("t1").value; document.getElementById("demo1").innerHTML="表格一的内容是"+x; } </script> </body>
使用方法の核心はoneKeyUp + メソッド名です。これに加えて、onkeypress、oneKeyDown などのキーワードもあります。個人的にはoneKeyUpの方が実用的だと思います。
関連する推奨事項:
ブートストラップの垂直応答に基づくjQueryのタイムライン効果
Node.jsを使ってみよう10のヒントアプリを使ってより速く実行するには
以上がよく使用される 3 つの JS 時間応答の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。