Sie können mit „value='foo'' keinen Wert in einem Webformular festlegen, aber die manuelle Eingabe des Werts ist in Ordnung?

Question

Ich habe versucht, den Wert mehrerer Felder in einem Webformular mit etwas wie document.getElementsByName('form[493202]')[0].value="Foo" festzulegen. Wenn ich dies in der Browserkonsole mache, wird das Feld aktualisiert, aber Wenn ich dann manuell auf das Feld klicke, wird der alte Wert wiederhergestellt. Die alten Werte wurden von mir manuell eingegeben. Hier ist eine seltsame Sache: Wenn ich einen Wert manuell eingebe, funktioniert alles wie erwartet, einschließlich des Absendens des Formulars. Wenn ich den Wert jedoch über JS eingebe, wird es dann gesendet

P粉436688931 · Answer

问题在于，当您使用 JavaScript 更改值时，用于验证表单是否为空的库不会更新。

您可能需要触发 input 事件（也许还有 change 事件），让这些验证库知道您已经填写了表单。

function myFunction() {
  var field = document.getElementsByName('form[493202]')[0];
  field.value = "Foo"

  // Trigger the oninput event
  var inputEvent = new Event('input');
  field.dispatchEvent(inputEvent);

  // Trigger the onchange event
  var changeEvent = new Event('change');
  field.dispatchEvent(changeEvent);
}