最实用的防丢失提示方式是结合 beforeunload 事件、isDirty 状态标记和可视化反馈：页面加载设 isDirty = false，监听 input/change 更新状态，提交后重置；beforeunload 中同步调用 e.preventDefault()；辅以顶部轻量提示文字和 localStorage 草稿自动保存。
用户填完表单但没点提交就准备离开，最实用的提示方式不是弹窗，而是结合 beforeunload 事件 + 状态标记 + 可视化反馈——既不打扰操作，又能真正防丢。
用 isDirty 标志跟踪修改状态
页面加载时设 let isDirty = false，只在用户真实改动后才置为 true：
- 对
<input>、<textarea></textarea>、<select></select>统一监听input或change事件（input更及时，支持中文输入法） - 避免监听
click或focus等无关事件，防止误标 - 表单提交成功后立即重置
isDirty = false，否则关页还会提示
beforeunload 触发简洁提示
现代浏览器已屏蔽自定义文案，只需同步调用 e.preventDefault() 即可触发标准提示：
- 写法必须是：
window.addEventListener('beforeunload', e => { if (isDirty) e.preventDefault(); }) - 不能在异步回调（如
setTimeout、fetch.then）里执行preventDefault，否则无效 - Safari 对无交互页面可能忽略该事件，所以仍需配合 localStorage 自动保存作为主防线
页面内加轻量视觉提示
比弹窗更友好：在表单顶部或右上角显示一行小字提示，随状态实时更新：
- 未改动时隐藏；首次输入后显示「草稿已自动保存」并带时间戳（如“10:23”）
- 若用户清空全部内容，可显示「当前无修改」并灰掉提示区域
- 提交成功后自动切换为「已发布 ✅」并 2 秒后淡出，避免用户困惑
- 提示文字不带按钮，不阻断操作，仅作信息同步
注意多标签页与 SPA 场景
单页应用或用户开多个编辑页时，容易出现状态错乱：
- 路由切换前手动移除
beforeunload监听器，防止重复绑定 - 用
localStorage存一个时间戳字段（如draft-last-modified），页面加载时比对，若本地草稿更新时间晚于当前页面初始化时间，说明有其他标签页已保存，可提示“检测到新草稿，是否恢复？” - 登录态切换或退出时，主动清理对应用户的草稿键名，避免残留
