如何实现Apps Script网页表单提交存值、退出重置功能？

你的现有实现思路已经契合需求，基于localStorage就能完成目标，仅需补充退出时重置的逻辑并小幅优化现有代码即可，具体步骤如下：

1. 保留并优化字段记忆逻辑 #

你已通过saveSubmittedValues和prefillDropdowns实现提交后保留supervisor和substation的选中状态，可将保存逻辑简化为批量处理：

function saveSubmittedValues() {
  const fieldsToSave = ['supervisor', 'substation'];
  fieldsToSave.forEach(fieldId => {
    localStorage.setItem(fieldId, document.getElementById(fieldId).value);
  });
}

2. 添加退出时的全量重置逻辑 #

监听页面关闭/跳转的beforeunload事件，清除本地存储并重置所有表单控件：

// 页面退出时清空存储并重置表单
window.addEventListener('beforeunload', function() {
  // 删除保存的字段值
  localStorage.removeItem('supervisor');
  localStorage.removeItem('substation');
  
  // 重置原生表单控件
  document.querySelector('form').reset();
  
  // 重置动态生成的下拉框
  const dynamicDropdowns = ['parcel', 'parcelId', 'status'];
  dynamicDropdowns.forEach(id => {
    const dropdown = document.getElementById(id);
    dropdown.innerHTML = '<option value=""></option>';
  });
  
  // 重置日期为今日、清空辅助内容
  setDefaultDate();
  document.getElementById('landowner-info-content').innerText = '';
  document.getElementById('submit-message').innerText = '';
  document.getElementById('submit-button').disabled = false;
});

3. 提交后重置非保留字段 #

在表单校验通过后，仅保留supervisor和substation，重置其他字段以便快速录入下一条记录：

function validateForm() {
  const supervisor = document.getElementById("supervisor").value;
  const substation = document.getElementById("substation").value;
  const parcel = document.getElementById("parcel").value;
  const parcelId = document.getElementById("parcelId").value;
  const status = document.getElementById("status").value;
  const date = document.getElementById("datePicker").value;
  const comment = document.getElementById("comment").value;

  if (!supervisor || !substation || !parcel || !parcelId || !status || !date || !comment) {
    document.getElementById("submit-message").innerText = "All fields must be filled.";
    return false;
  }

  saveSubmittedValues();

  // 重置非保留字段
  const fieldsToReset = ['parcel', 'parcelId', 'status', 'comment'];
  fieldsToReset.forEach(id => {
    document.getElementById(id).value = '';
  });
  setDefaultDate();
  document.getElementById('landowner-info-content').innerText = '';

  // 延迟启用提交按钮避免重复提交
  setTimeout(() => {
    document.getElementById('submit-button').disabled = false;
  }, 1500);

  return true;
}

关键说明 #

• localStorage是无需后端配合的最简前端存储方案，完全适配你的需求；
• beforeunload事件覆盖页面关闭、刷新、跳转等所有"退出"场景，确保重置彻底；
• 提交后仅保留高频字段，其他字段即时重置，兼顾操作连贯性和录入效率。

内容的提问来源于stack exchange，提问作者Kolev_I_N