Heim > Web-Frontend > js-Tutorial > Wie identifiziere ich den Initiator eines Unschärfeereignisses mithilfe der relatedTarget-Eigenschaft?

Wie identifiziere ich den Initiator eines Unschärfeereignisses mithilfe der relatedTarget-Eigenschaft?

Barbara Streisand
Freigeben: 2024-10-19 14:43:30
Original
1026 Leute haben es durchsucht

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

Bestimmen des Elements, das ein Unschärfeereignis ausgelöst hat

Problemstellung:

Wenn eine Unschärfe auftritt Das Ereignis tritt in einem HTML-Eingabeelement auf. Wie können wir die ID des Elements ermitteln, das den Fokusverlust ausgelöst hat?

Antwort:

Um das Element zu identifizieren, das den Fokusverlust ausgelöst hat Bei einem Blur-Ereignis können wir die relatedTarget-Eigenschaft des Ereignisses nutzen. Diese Eigenschaft stellt das Zielelement dar, das nach der Unschärfe den Fokus erhalten hat.

Stellen Sie sich beispielsweise das folgende Szenario vor:

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

Wenn Sie den Fokus von myInput verlieren, indem Sie auf mySpan klicken, wird onBlurEvent() Funktion wird ausgelöst. Um die ID des Elements zu ermitteln, das den Fokus erhalten hat (mySpan), können wir auf die Eigenschaft „relatedTarget“ innerhalb der Funktion zugreifen:

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

Zusätzlicher Kontext:

Diese Technik findet Anwendung in Szenarien, in denen Sie das standardmäßige Unschärfeverhalten unterdrücken und verhindern müssen, dass die Autovervollständigung verschwindet, wenn auf ein bestimmtes Element geklickt wird. Um dies zu erreichen, können Sie die event.latedTarget.id innerhalb der Funktion onBlurEvent() überprüfen und das Unschärfeereignis ignorieren, wenn es vom gewünschten Element stammt.

Das obige ist der detaillierte Inhalt vonWie identifiziere ich den Initiator eines Unschärfeereignisses mithilfe der relatedTarget-Eigenschaft?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:php
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Neueste Artikel des Autors
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage