html<!DOCTYPE html><html> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title> </head> <body> <textarea name="" id="a" cols="30" rows="10"></textarea> <textarea name="" id="b" cols="30" rows="10"></textarea> <textarea name="" id="c" cols="30" rows="10"></textarea> </body></html>jsconst first = document.getElementById("a");const second = document.getElementById("b");const third = document.getElementById("c");first.addEventListener("input", () => { second.value = first.value;});second.addEventListener("change", () => { console.log("work!!") third.value = second.value;});codepen -> https://codepen.io/dmgpgdmgpg/pen/NWRxVbg?editors=1111第一 -> 第二可以，但第二 -> 第三不行因为当用户提交对元素值的更改时，将针对 input、select 和 textarea 元素触发 Change 事件。（MDN）如何在第一个文本区域更改后检测第二个文本区域的更改？我想从第一传递到第二，第二到第三（不是第一 -> 第三）
1 回答
偶然的你
TA贡献1841条经验 获得超3个赞
如果您想在第二个文本区域输入后更改第三个文本区域输入，与第一个文本区域的工作方式相同，请尝试以下操作：
<textarea name="" id="a" cols="30" rows="10"></textarea> <textarea name="" id="b" cols="30" rows="10" oninput="changeText()"></textarea> <textarea name="" id="c" cols="30" rows="10"></textarea>
输入事件：
该事件与 onchange 事件类似。不同之处在于 oninput 事件在元素的值更改后立即发生，而 onchange 在内容更改后元素失去焦点时发生。另一个区别是 onchange 事件也适用于元素。
编辑：
如果您需要检测 JS 触发的更改而不是用户触发的更改，可能是添加事件调度的最佳方法
const first = document.getElementById("a");
const second = document.getElementById("b");
const third = document.getElementById("c");
const event = new Event('input', {
bubbles: true,
cancelable: true,
});
first.addEventListener("input", () => {
second.value = first.value;
second.dispatchEvent(event);
});
second.addEventListener ('input', () => {
third.value = second.value;
});
除了手动触发之外，我没有找到任何方法可以在非用户本人的更改时从文本区域触发事件
添加回答
举报
0/150
提交
取消