javascript - 我很困惑 - 设置表单字段的值但它没有显示

Question

我有一个包含 3 个文本输入的表单，用于编辑表中的记录。所有记录的 3 个字段的值都存储在 JavaScript 数组中。我有一个 SELECT 显示表中所有记录的名称字段。当我选择一个选项时，javascript 会使用该记录的值填充 3 个表单字段“值”，以供用户编辑。这 3 个输入包含在相同的 DIV 容器中，并且 3 个输入的属性是相同的(除了 id 和 id )名称)。

JavaScript 运行后，第一个字段将显示其分配的值，但其他两个字段继续显示其占位符。当我做出选择时，我可以在开发人员工具中观察 DOM 中的值发生变化，但表单字段中没有显示任何内容。我假设我的代码正在填充 INPUT 值，因为 DOM 正在按预期更改。

我尝试更改表单中字段的顺序，现在所有 3 个字段都无法显示其值，而 DOM 仍然显示带有值的元素。将现场秩序恢复到原来的样子并没有帮助。

Chrome 和 FireFox 中的行为相同。

      document.getElementById("accountname").innerHTML         = selectedname
  document.getElementById("accountdescription").innerHTML  = jdescriptions[jnames.indexOf(selectedname)]
  document.getElementById("accountcode").innerHTML         = jcodes[jnames.indexOf(selectedname)]

This screendump image shows how the FORM and the DOM are different

说实话，我很困惑。任何想法表示赞赏。

Answer 1

你应该设置input元素的value属性，你不能使用innerHTML，因为我们在input标签之间没有写任何东西。由于您正在设置输入标记的innerHTML，因此您的屏幕截图显示<input></input>之间的另一个帐户但这不是将为输入元素显示的值。属性innerHTML 用于像Div 这样的元素。

document.getElementById("accountname").value = selectedname;