在javascript中动态生成表单--但添加的每个新字段都会丢失先前字段的值

// 创建表单元素
var form = document.createElement('form');
form.id = 'myForm';

// 存储字段值的对象
var fieldValues = {};

// 添加字段
function addField() {
  var input = document.createElement('input');
  input.type = 'text';
  input.name = 'field' + Object.keys(fieldValues).length;
  input.addEventListener('input', function() {
    fieldValues[input.name] = input.value;
  });
  form.appendChild(input);
}

// 添加按钮
var submitButton = document.createElement('button');
submitButton.textContent = '提交';
submitButton.addEventListener('click', function() {
  // 提交表单的逻辑
  console.log(fieldValues);
});
form.appendChild(submitButton);

// 添加字段按钮
var addButton = document.createElement('button');
addButton.textContent = '添加字段';
addButton.addEventListener('click', addField);
form.appendChild(addButton);

// 将表单添加到页面中
document.body.appendChild(form);