将文本从一个 textarea 元素实时复制到另一个元素答案

【问题标题】：Copying text from one textarea element to another in real-time将文本从一个 textarea 元素实时复制到另一个元素
【发布时间】：2020-11-06 11:13:43
【问题描述】：

我想将输入从一个文本区域实时复制到另一个文本区域。这不是 HTML 编辑器或富文本编辑器。只是没有任何标记的简单文本。

这就是我正在做的：

一个。我可以使用以下（在 mouseup 上）检测在源文本区域中单击光标的点

 $("#txt1")[0].selectionStart)

b.我可以使用 mouseup 上的 selectionStart 和 selectionEnd 属性检测文本选择。这使我可以跟踪删除以反映在其他文本区域中。也就是说，如果删除是按下的键，并且进行了选择，我知道要在目标文本区域中反映的内容被删除。

c。我卡住的地方是输入新字符的简单问题。我认为跟踪按键是一种低效的方法，因为我必须检查控制、alt、shift 键等是否也被按下。此外还有重复按键的问题。 有效的方法可能是从源文本区域获取实际输入的字符，而不是基于按键。

问题：如何获取源文本区域中输入的字符？

有没有更好的方法来实时更新目标文本区域？一种方法是定期将内容从源更新到目标，但这会效率低下。还有其他方法吗？

我愿意使用 contentEditable div 代替 textarea。

我需要一个可以跨不同设备类型工作的解决方案。

【问题讨论】：

请始终在问题中包含您正在使用的相关代码。我会认为有人与您的代表。会知道的。
@ScottMarcus 编程问题！= 包含代码。编程比编写代码要多得多。我会认为有人与您的代表。当然应该知道。
不要刻薄，要意识到解决问题总是有多种方法。如果我们看不到您正在使用的代码，我们就无法为您提供最佳解决方案（或者甚至可以在您的代码中使用的解决方案）。是的，您在这里待的时间已经够久了，您应该知道这一点。
我猜测并提供了一些似乎符合您在下面要求的内容，但可能不是，因为我看不到您实际在做什么。
@ScottMarcus 同意我本可以在这个特定问题上做得更好并且应该这样做，但我不同意所有编程问题都应始终伴随代码的评论。无论如何，谢谢你的回答。将来可能会尝试添加代码。

【解决方案1】：

如何获取在源文本区域中输入的字符？

只需处理第一个textarea 的input 事件，并使第二个textarea 具有与第一个相同的值。

let two = document.getElementById("two");
document.getElementById("one").addEventListener("input", function(){
  two.value = this.value;
});

<textarea id="one"></textarea>
<textarea id="two"></textarea>

【讨论】：