模态中的 <input> 显示错误的值答案

【问题标题】：<input> in modal is showing wrong values模态中的 <input> 显示错误的值
【发布时间】：2020-09-14 18:41:01
【问题描述】：

我已将我最初的问题简化为一个更简单的示例，可以在 JS Fiddle 上复制。

我有一个模态对话框 (#popup)，其中包含一些用 V 类装饰的 <input>s：

<input class="V" type="number" />
<input class="V" type="text" />

我有一个按钮，可以将每个 <input> 的 value 属性设置为某个值并启动此模式：

<button onclick="edit();">Edit</button>

<script>
  edit = () => {
    const inputs = $(".V");
    inputs[0].setAttribute("value", "999");
    inputs[1].setAttribute("value", "998");
    $("#popup").modal("show");
  }
</script>

在模态中，如果我更改 <input> 元素的值并关闭它，下次我再次启动它时，<input> 会显示更改后的值，而不是显式设置的值，999 或 998。

为什么会这样？

如果模态框包含单个 <input> 并且我使用 jQuery 的 .val() 方法来设置值，则问题不存在。

【问题讨论】：

代码在哪里？你有多少“Project_1”的对象？（是的，这有很大的不同）
模态中的<input>元素不止一个。我已经减少了问题并在 JS Fiddle 中重现了它。
@OldGeezer，尝试设置像这样的值inputs[0].value = '999'; 和这里的分叉小提琴，jsfiddle.net/2xqtganu/1
谢谢，这行得通。是什么原因？ setAttribute 第一次工作，但 <input> 没有改变。
value -- "定义一个默认值，该值将在页面加载时显示在元素中。"所以它只工作一次：在页面加载时。

标签： twitter-bootstrap dom bootstrap-4 bootstrap-modal dhtml

【解决方案1】：

所以你需要单独设置，这里是 jQuery 版本

edit = () => {
  const inputs = $(".V");
  $(inputs[0]).val(999)
  $(inputs[1]).val("999")
  $("#popup").modal("show");
}

--- 旧解决方案--- 这是 jQuery，你可以这样做：

edit = () => {
  const inputs = $(".V");
  inputs.val(999);
  $("#popup").modal("show");
}

【讨论】：

这对我不起作用。我需要用不同的值更新每个<input>。我在示例中使用相同的 999 仅用于演示目的。
您更新的解决方案有效，但这意味着每次都需要对 DOM 树进行 jQuery 搜索。 @Maniraj Murugan 建议使用 .value 更有效，因为 Html 元素列表已经可用。但是这两种方法都不能解释为什么.setAtrribute("value") 只在某些时候有效。
我相信我已经解释过了。 VALUE 仅适用于初始页面加载。