Können Sie Teile des Texts eines Eingabefelds formatieren?

Teile eines Eingabefelds gestalten

Frage:

Ist es möglich, anders anzuwenden? Stile für bestimmte Segmente des Werts eines Eingabefelds, während der Benutzer diese eingibt Text?

Antwort:

Leider können Stile nicht selektiv auf Teile eines Eingabefelds angewendet werden.

Workaround:

Um den gewünschten Effekt zu erzielen, ist eine Lösung aus mehreren Elementen erforderlich notwendig.

Ansatz:

1. Elementteilung:

   • Dividieren Das Eingabefeld wird je nach Einfügung in drei Abschnitte unterteilt Punkt:

     • Vorher:Zuvor eingegebener Text
     • Bearbeitet:Aktuell eingegebener Text
     • Nachher : Nach dem Einfügen eingegebener Text Punkt

2. Markup-Generierung:

   • Ersetzen Sie das Eingabeelement durch ein Containerelement, das ähnelt ein Eingabefeld.
   • Teilen Sie den ursprünglichen Eingabewert in die drei genannten Abschnitte auf oben.
   • Umschließen Sie jeden Abschnitt in einzelne Elemente (z. B. Spannen).

3. Ereignisbehandlung:

   • Überwachen Sie Benutzereingaben mithilfe von Ereignis-Listenern (z. B. Klicken, Tastendruck, keyup).
   • Verwenden Sie diese Ereignisse, um die drei Abschnitte des Eingabewerts zu identifizieren.
   • Aktualisieren Sie die Elementstile basierend auf dem bearbeiteten Abschnitt.

Beispiel-Markup:

<div class="input">
  <span class="nonEdited before">foo</span>
  <span class="edited">fizz</span>
  <span class="nonEdited after">bar</span>
</div>

Das obige ist der detaillierte Inhalt vonKönnen Sie Teile des Texts eines Eingabefelds formatieren?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!