将表单数据保存到序列化数组 Javascript 后，重新填充表单

Question

我正在创建一个我希望用户能够编辑的表单。用户将填写表单，保存该表单，用下一个条目填写表单，保存该表单等。每次保存表单时都会创建一个可点击的 div，以便用户可以返回并查看他们的输入以确保他们在最终提交所有表格之前是正确的。我已经能够保存表单数据这样做：

    var formArray = $('form#popsetForm').serializeArray();

我的问题：我现在想在用户单击 div 时用 formArray 中的数据填回表单。是否有一个简单的命令可以让我只提供数组作为输入，它会自动填写表单？下面不是真正的代码，但我希望存在。

    $('form#popsetForm').populate(formArray)

Answer 1

我不知道是否已经存在解决方案，但类似的东西应该适用于serializeArray.

function restoreForm(form, formArray) {
  formArray.forEach(function (pair) {
    var selector = `input[name="${ pair.name }"], textarea[name="${ pair.name }"]`
    var input = $(form).find(selector)
    input.val(pair.value);
  })
}

https://jsfiddle.net/aycnx0gd/4/

或者像这样的常规ol'formData

function restoreForm(form, formData) {
  for (var key of formData.keys()) {
    var selector = `input[name="${ key }"], textarea[name="${ key }"]`
    var input = $(form).find(selector)
    var newVal = formData.get(key)
    input.val(newVal);
  }
}

https://jsfiddle.net/aycnx0gd/2/