ホームページ  >  記事  >  ウェブフロントエンド  >  関連ターゲット プロパティを使用してブラー イベントのイニシエーターを識別する方法

関連ターゲット プロパティを使用してブラー イベントのイニシエーターを識別する方法

Barbara Streisand
Barbara Streisandオリジナル
2024-10-19 14:43:30900ブラウズ

How to Identify the Initiator of a Blur Event Using the relatedTarget Property?

ブラー イベントを開始した要素の特定

問題ステートメント:

ブラーが発生したときHTML 入力要素でイベントが発生しました。フォーカスの喪失を引き起こした要素の ID を確認するにはどうすればよいですか?

回答:

フォーカスの喪失を引き起こした要素を特定するにはブラー イベントの場合は、イベントの関連ターゲット プロパティを利用できます。このプロパティは、ブラーの後にフォーカスを受け取ったターゲット要素を表します。

たとえば、次のシナリオを考えてみます。

<code class="html"><input id="myInput" onblur="onBlurEvent()" />
<span id="mySpan">Hello World</span></code>

mySpan をクリックして myInput からフォーカスを失った場合、onBlurEvent()機能がトリガーされます。フォーカスを受け取った要素 (mySpan) の ID を確認するには、関数内の関連ターゲット プロパティにアクセスします:

<code class="js">function onBlurEvent() {
  console.log(event.relatedTarget.id); // Output: "mySpan"
}</code>

追加コンテキスト:

この手法デフォルトのぼかし動作を抑制し、特定の要素がクリックされた場合にオートコンプリーターが消えるのを防ぐ必要があるシナリオでのアプリケーションを見つけます。これを実現するには、onBlurEvent() 関数内でevent.popularTarget.idを確認し、目的の要素から発生したブラー イベントを無視します。

以上が関連ターゲット プロパティを使用してブラー イベントのイニシエーターを識別する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。