Javascript 如何将同一文本从一个文本区域显示到另一个文本区域，反之亦然？

如何通过自动复制和更新文本，使下面示例中的三个

文本区域

同时显示相同的文本

如果我输入或更改

textarea 1

中的文本，它应该自动复制/更新

textarea 2

和

textarea 3

中的所有文本，反之亦然？现在它似乎只从

textarea 1

复制和更新文本

$（文档）.ready（函数（）{
$（“#字段_1”）。关于（'change'，函数（e）{
$（'#field_2'）.val（$（'#field_1'）.val（））；
$（'#field_3'）.val（$（'#field_1'）.val（））；
});
});
这应该可以做到：


$（文档）.ready（函数（）{
const ta=document.queryselectoral（'textarea'）；
ta.forEach（t=>{
t、 addEventListener（'input'，e=>{
ta.forEach（t=>{
t！==e.target&（t.value=e.target.value）；
});
})
});
});
我认为这应该行得通


$（文档）.ready（函数（）{
$（'：input'）.keyup（函数（）{
$（'#字段_1'）.val（$（this.val（））
$（'#字段_2'）.val（$（this.val（））
$（'#字段_3'）.val（$（this.val（））
});
});
类似的东西可以工作，捕获更改事件，也可以在主体上捕获它，而不是添加
sync\u容器
div

$（文档）.ready（函数（）{
document.getElementById（'sync_container'）。addEventListener（'change'，函数（事件）{
var元素=event.target；
var-controls=element.getAttribute（'aria-controls'）；
如果（控制）{
控件=控件。拆分（“”）；
控件。forEach（函数（id）{
var next=document.getElementById（id）；
如果（下一个）{
next.value=element.value；
}
});
}
}，对）；
});

简单，香草js更轻


//首先使用元素创建数组
让allTextAreas=[…document.querySelectorAll（'textarea'）]；
所有TextAreas.forEach（textArea=>{
//对于每个元素，添加输入侦听器
textArea.addEventListener（'click'，（{target:{value}}}）=>{
//输入时，更新所有其他元素
所有文本区域
.filter（项目=>item！=textArea）
.forEach（项目=>{
项目价值=价值；
})
})
})
我们可以使用代理查看更改并更新所有文本区域


let field1=document.getElementById（“field_1”）；
设field2=document.getElementById（“field_2”）；
设field3=document.getElementById（“field_3”）；
常数数据={
值：“”
};
常量处理程序={
设置（目标、键、值）{
field1.value=field2.value=field3.value=value；
}
};
const proxy=新代理（数据、处理程序）；
字段1.addEventListener（“输入”，（事件）=>{
proxy.value=event.target.value；
日志（event.target.value）；
});
字段2.addEventListener（“输入”，（事件）=>{
proxy.value=event.target.value；
日志（event.target.value）；
});
字段3.addEventListener（“输入”，（事件）=>{
proxy.value=event.target.value；
日志（event.target.value）；
});

您好，非常感谢。只有一个问题是，如何从中排除textarea？因为我还有几个不想复制这些文本区域？请选择您需要的：
document.queryselectoral（'textarea.this should sync'）
很抱歉，您怎么做？它是否像
document.querySelectorAll（'textarea.field1，textarea.field2'）
？我也非常喜欢这个解决方案，尤其是不必在任何其他地方单击光标的实时更新。向想要同步的对象添加一个类，比如说
class=“sync”
，然后像这样选择它们：
document.querySelectorAll（'textarea.sync'））
你好！我真的很感谢你的帮助。但是，如果我的文本区域不能分组到一个
sync\u容器中，您能告诉我如何使用这个吗？因为我的其他文本区域来自不同的集合。我非常喜欢这个解决方案。只需将这个
document.getElementById（'sync\u container'）
更改为这个：
document.body