用JavaScript在电子邮件输入字段中键入值

Question

我试图用JavaScript将电子邮件地址写入输入字段。这应该没有那么难。但是我做不到。输入字段具有验证。也许这就是问题所在。

我已经试过了:

document.getElementsByClassName('sc-kEYyzF mqvXI')[0].setAttribute("value", "[e-mail]");
document.getElementById("email").value = "[e-mail]";

但是当我点击提交按钮后，输入就消失了。我正在这个网站上尝试:https://welcome.onelog.ch/

编辑:感谢@epascarello。用他的代码我找到了正确的解决方案

解决方案:

let lastValue = input.value;
input.value = '[e-mail]';
let event = new Event('input', { bubbles: true });
event.simulated = true;
let tracker = input._valueTracker;
if (tracker) {
tracker.setValue(lastValue);
}
input.dispatchEvent(event);```

Answer 1

这里的问题是它是React和React添加事件和跟踪值的东西。当您直接设置该值时，它会忽略更改。当您设置了该值而onchange事件不触发时，这是没有区别的。

所以你需要做一些魔术来让React看到这个变化。

const tb = document.getElementById("email");
tb._valueTracker && tb._valueTracker.setValue(tb.value);
tb.value = "[e-mail]";
tb.dispatchEvent(new Event('input', { bubbles: true, simulated: true, }));

Answer 2

表单在提交后重置。试着在表单中添加onsubmit ="return false">