如何在 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中文网其他相关文章！