如何使用 JS 更改 textarea 的值与用户输入不同？

Question

这对我来说有点神秘，但我相信拥有更多 JS 专业知识的人将能够解决这个问题。 我使用了一个大型在线论坛网站。 回到过去，我可以通过 JS 轻松更改评论元素（textarea），即

document.querySelector("textarea").value = "foo"

然后我会手动或脚本单击保存按钮，它会按您的预期保存。

该网站不久前重新设计了他们的整个前端。 当我现在执行完全相同的操作时，不会保存更改。 在我激活更改操作的那一刻，原始值被呈现。

我的问题是他们是怎么做到的？ 他们如何区分是用户输入还是脚本更改了值？

• textarea DOM 元素是唯一改变的东西
• Redux 中没有任何不同之处
• 我尝试发送一个keydown，但这也没有成功
• 仅当我实际单击评论字段并按下按钮时，更改才会正确保存

Answer 1

更改domElem.value不会触发 DOM 元素上的任何事件。 如果要模拟任何事件，则必须通过domElem.dispatchEvent手动触发事件。

例如：如果你想模拟按键'a'，你必须写这样的东西。

 document.querySelector("#name").value = 'a' document.querySelector("#name").dispatchEvent( new KeyboardEvent('keypress', { key: 'a' }) ) // or if you want to trigger onchange event you have to do something like this. document.querySelector("#name").dispatchEvent( new KeyboardEvent('change', { key: 'a' }) )

 <input id="name" type="text" />