私たちは基本的に、JavaScript でプログラミングしているときに、ボタンをクリックするだけで任意の関数を作成できる、ある種の状況に直面します。たとえば、Web ページやサイトの自動テストの際には、さらにいくつかの機能を検討する必要があります。このような場合、JavaScript のクリック イベントをトリガーする手法は、前述の課題に対抗するためにより信頼性が高く、効率的になります。
夕食と夕食の時間
これに関連して、JavaScript のトリガー クリック イベント プロシージャについて学習します。
JavaScript でクリック イベントをトリガーする方法:
JavaScript でクリック イベントをトリガーするには、以下のテクニックを適用する必要があります。
a) click() メソッド
b) addEventListener() メソッドと dispathEvent メソッド
ここで、上で書いたメソッドを使用して、次のように説明します。
方法 1:
JavaScript のクリック イベント メソッドを使用してクリック イベントをトリガーします。
言及された要素については、 クリック方法 アクションを実行するために使用されます。必要なボタンがユーザーによってクリックされたときに、ボタンの作成、その ID の取得、クリック イベントのトリガーを利用してユーザー定義関数を使用すると、このメソッドを実装できます。
さらに明確にするために、以下の例を見てみる必要があります。
配列Javaに追加
例：
以下の例では、 'ここをクリック' 、ボタンは、そのボタンのクリック イベントにアクセスするための ID とクリック イベントとともに作成されます。
Click here
JavaScriptでIDを指定することで、document.getElementByIdメソッドで作成したボタンにアクセスする必要があります。次の操作を実行するには、クリック イベントが呼び出されます。
const get= document.getElementById('btn'); get.click();
最後に、ボタンがクリックされたときに、次の関数を出力するように定義します。 'クリックイベント()' コンソール上でクリック方式を使用する方法です。
function clickEvent() { console.log('now the Click Event is triggered ') } 上記のそれぞれのコードの出力から、click メソッドを自動化された方法で使用して、ボタン click here がクリックされたことが分かりました。
方法 2:
addEventListener() メソッドとdispatchEvent() メソッドを使用して、JavaScript でクリック イベントをトリガーします。
JavaScript では、JavaScript イベント ターゲット インターフェイスによって提供される統合メソッドです。
イベントリスナーはこのメソッドで登録されます。前述のイベントがターゲットでキャッチされたときに、設定された関数を呼び出します。
イベントの構文:
target.addEventListener( $type, $listener); target.addEventListener( $type, $listener, $options); target.addEventListener( $type, $listener, $useCapture);
構文の説明:
- 上記の構文には、というパラメータがあります。 $type 、これは必須パラメータです。監視するイベントのタイプを示すパラメータは、文字列を 1 つだけ受け入れます。このパラメータは大文字と小文字が区別されます。キーボード、クリック、データベース、入力などのさまざまなイベントがサポートされています。
- 同様に、 $listener も必須パラメータです。前述のタイプのイベントが発生したときに、イベントに関する通知がこのパラメーターによってオブジェクトとして受信されます。 JavaScript 関数または Eventlistner インターフェイス上で、このオブジェクトを実装する必要があります。
- 一方、 $オプション です オプションのパラメータ 初期化。
例: 1
Open bing const link = document.getElementById('btn'); link.addEventListener('click', e => {}); for(let i = 0; i <5; i++) { link.dispatchevent(new event('click')); } function opengooglebymethod() console.log('the required event is triggered') < pre> <p> <strong>Output:</strong> </p> <pre> 'The required event is triggered'. 'The required event is triggered'. 'The required event is triggered'. 'The required event is triggered'. 'The required event is triggered'. </pre> <p> <strong>Example 2:</strong> </p> <p>In this example, first of all, we will include a button with a corresponding id with an onclick event along with a value as same as like previous one.</p> <pre> Click here </pre> <p>After that, with the help of the <strong> <em>addEventListener()</em> </strong> method, we will retrieve the button and click the event in it to specify the <strong> <em>'e'</em> </strong> in its argument, which refers to the event click object.</p> <pre> const get = document.getElementById('btn'); get.addEventListener('click', e => {}); get.dispatchEvent(new Event('click')); </pre> <p>Finally, as same as the previous method, we will define the click event to display the corresponding message in it at the time the click event is triggered.</p> <pre> function clickEvent() { console.log('The required event is triggered ') } </pre> <hr></5;> 例 2:
Javaの命名規則
この例では、まず、onclick イベントに対応する ID を持つボタンと、前の例と同じ値を含めます。
Click here
その後、皆様のご協力を得て、 addEventListener() メソッドでは、ボタンを取得し、その中のイベントをクリックして、 「そうですよ」 引数でイベントクリックオブジェクトを参照します。
const get = document.getElementById('btn'); get.addEventListener('click', e => {}); get.dispatchEvent(new Event('click')); 最後に、前の方法と同様に、クリック イベントがトリガーされたときに対応するメッセージを表示するクリック イベントを定義します。
function clickEvent() { console.log('The required event is triggered ') }