So erfassen Sie ausgewählten Text aus einem Textfeld in JavaScript: Eine umfassende Lösung

So erfassen Sie die Textauswahl aus einem Textfeld in JavaScript

Viele JavaScript-Entwickler stehen vor Herausforderungen, wenn sie den ausgewählten Text aus einem Textfeld-Steuerelement abrufen möchten . Dieser Artikel behandelt dieses Problem mit einer umfassenden Analyse und einer praktischen Lösung.

Erfassen von ausgewähltem Text für moderne Browser:

Für moderne Browser, die die HTML5-Auswahl-API unterstützen, ist die Das folgende Code-Snippet kann verwendet werden:

<code class="javascript">function ShowSelection() {
  const textArea = document.getElementById('textbox');
  const selection = textArea.selectionStart !== undefined
    ? textArea.value.substring(textArea.selectionStart, textArea.selectionEnd)
    : '';
  alert(`You selected: ${selection}`);
}</code>

Ausgewählten Text für Internet Explorer erfassen:

Internet Explorer erfordert einen anderen Ansatz. Der folgende Code für diesen Browser:

<code class="javascript">if (document.selection !== undefined) {
  textArea.focus();
  const sel = document.selection.createRange();
  const selection = sel.text;
  alert(`You selected: ${selection}`);
}</code>

Auswahl beim Klicken auf eine Schaltfläche beibehalten:

Um zu verhindern, dass die Auswahl gelöscht wird, wenn auf eine Schaltfläche geklickt wird, muss der Fokus liegen in das Textfeld zurückgekehrt. Dies kann durch die Behandlung des onkeydown-Ereignisses erreicht werden:

<code class="javascript">document.onkeydown = function (e) { ShowSelection(); };</code>

Schaltfläche mit Eingabe-Tag:

Dieser Ansatz funktioniert zwar für Schaltflächen, die mit dem li-Tag gezeichnet wurden, kann es aber sein Funktioniert bei Schaltflächen, die mit dem Eingabe-Tag gezeichnet wurden, nicht ordnungsgemäß. Für den letzteren Fall gibt es alternative Lösungen, wie zum Beispiel die Verwendung der Ereignisse onfocus und onblur, um die Auswahl aufrechtzuerhalten.

Durch die Implementierung des bereitgestellten Codes können Entwickler den ausgewählten Text effektiv aus einem Textfeld-Steuerelement erfassen und anzeigen und so eine nahtlose Darstellung gewährleisten Benutzererfahrung in verschiedenen Browsern.

Das obige ist der detaillierte Inhalt vonSo erfassen Sie ausgewählten Text aus einem Textfeld in JavaScript: Eine umfassende Lösung. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!