如何在 JavaScript 中從文字方塊中擷取選定的文字：綜合解決方案

如何在JavaScript 中從文字方塊中擷取文字選擇

許多JavaScript 開發人員在從文字方塊擷取所選文字時遇到控制項到挑戰。本文透過全面的分析和實用的解決方案解決了這個問題。

為現代瀏覽器擷取所選文字：

對於支援HTML5 選取API 的現代瀏覽器，可以使用下列程式碼片段：

<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>

捕獲Internet Explorer 的選定文字：

Internet Explorer 需要不同的方法。此瀏覽器的以下程式碼：

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

在按鈕點擊時維護選擇：

要防止點擊按鈕時清除選擇，焦點必須為返回到文字方塊。這可以透過處理onkeydown 事件來實現：

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

帶有輸入標籤的按鈕：

雖然此方法適用於使用li 標籤繪製的按鈕，但它可能使用輸入標籤繪製的按鈕無法正常工作。對於後一種情況，存在替代解決方案，例如使用 onfocus 和 onblur 事件來維持選擇。

透過實作提供的程式碼，開發人員可以有效地擷取並顯示從文字方塊控制項中選取的文本，從而確保無縫不同瀏覽器的使用者體驗。

以上是如何在 JavaScript 中從文字方塊中擷取選定的文字：綜合解決方案的詳細內容。更多資訊請關注PHP中文網其他相關文章！