sessionStorage 适用于表单多页跳转临时值管理，需实时存、精准读、及时清：每页字段变更即存，按 name 加前缀键名存储；页面加载时自动恢复，注意控件类型赋值差异；跨页跳转存取筛选上下文；提交或退出时主动清理，敏感信息禁存，隐私模式需降级处理。
网页应用用 sessionStorage 保存表单多页跳转的临时值，关键在于「实时存、精准读、及时清」——它不跨标签页、刷新不丢、关页即清，天然适配用户填到一半切走再回来的场景。
每页字段变化时立即保存
别等用户点“下一步”才存，那样容易丢失最后一次输入。对当前页所有可编辑控件（input、textarea、select、[type="checkbox"]、[type="radio"]）绑定 input 或 change 事件：
- 文本类控件取 .value，复选框/单选框取 .checked，下拉框优先用 .value
- 以字段 name 为 key 存储，例如 sessionStorage.setItem('step2_phone', '138****1234')
- 多个页面可能共用相同字段名（如 email），建议加前缀区分，如 'step1_email'、'step3_email'
页面加载时自动恢复数据
在 DOMContentLoaded 阶段就执行恢复逻辑，而不是等用户操作：
- 遍历当前页所有表单字段，对每个 name 尝试读取对应键值，例如 sessionStorage.getItem('step2_phone')
- 用 try...catch 包裹 JSON 解析和赋值过程，避免因存储损坏导致脚本中断
- 文本框直接赋 .value；复选框/单选框必须显式设 .checked = true/false；禁用字段先临时启用再赋值，完成后还原状态
跨页跳转时保持筛选或流程上下文
用户从列表页进详情页、或多步骤间来回切换，重点不是“能不能存”，而是“存得清、读得准”：
- 跳转前（如点击“查看详情”），把当前筛选条件对象序列化后存为 sessionStorage.setItem('list_filter', JSON.stringify({ keyword: '张三', page: 2 }))
- 返回后（如列表页 DOM 加载完成），读取并解析，同步到搜索表单和分页控件
- 若用 Vue/React，不要依赖组件缓存（keep-alive），统一以 sessionStorage 为唯一可信数据源
提交或退出时主动清理
sessionStorage 不会自动识别哪些是有效草稿、哪些是过期垃圾，必须由业务控制：
- 表单提交成功后，立即调用 sessionStorage.removeItem('step1_data') 等逐个清除，或用正则批量删除所有 step* 键
- 用户点击“重新开始”或主动退出流程，执行 sessionStorage.clear() 或按前缀清理
- 敏感字段（如身份证号、银行卡号）绝不可存入 sessionStorage
- 隐私模式下部分浏览器会禁用 sessionStorage，需检测 setItem 是否抛错，失败时降级为内存缓存
