单击按钮时返回表单中的先前值（Javascript）答案

【问题标题】：Return the previous values in the form when the button is clicked (Javascript)单击按钮时返回表单中的先前值（Javascript）
【发布时间】：2022-02-17 18:32:38
【问题描述】：

我有如下所示的表格。我希望当您单击“取消更改”按钮时，字段的值会返回到以前的值。

例如，如果我有单词 John 并且我删除了 hn（因此有 Jo），单击按钮我希望它返回给 John。

我该怎么做？

<form >
  <label for="fname">First name:</label><br>
  <input type="text" id="fname" name="fname"><br>
  <label for="lname">Last name:</label><br>
  <input type="text" id="lname" name="lname"><br><br>
  <input type="submit" value="Cancel changes">
</form>

【问题讨论】：

标签： javascript html

【解决方案1】：

submit 按钮提交表单。要将表单重置为初始值，您应该使用 reset 按钮。

<form >
  <label for="fname">First name:</label><br>
  <input type="text" id="fname" name="fname"  value="John"><br>
  <label for="lname">Last name:</label><br>
  <input type="text" id="lname" name="lname" value="Smith"><br><br>
  <input type="reset" value="Cancel changes">
</form>

【讨论】：

【解决方案2】：

我不确定这是否是正确的问题。

但是，如果您想要的是“CTRL + Z”的外观，您可以在每个用户输入时将表单的状态保存在 Object 或 LocalStorage 中，然后将这些元素重新分配给当我们点击CANCEL时对应的字段。

有很多像这样的解决方案： https://gist.github.com/shawnbot/89855705204494c6d8bf

【讨论】：