close事件仅在dialog通过showModal()打开且由close()、Esc或点击backdrop关闭时触发；returnValue需在close回调中读取，Esc/backdrop关闭时为空字符串；close回调内再调close()会报错。
dialog.close() 触发的 close 事件到底在什么时候发生
close 事件只在 dialog 元素处于 open 状态、且被显式关闭时触发。不是所有“看起来关了”的操作都会派发它——比如你用 show() 打开的 dialog，按 Esc 或点外面，根本不会触发 close 事件，也不会关闭。
必须满足两个前提：
-
dialog.showModal()已调用（show()不行） - 关闭动作来自以下三者之一：
dialog.close()、用户按 Esc、点击::backdrop（灰色遮罩层）
常见错误：监听写了，但 close 事件从不执行。大概率是漏了 showModal()，或者误以为设置 dialog.open = true 就等同于模态打开——它只是渲染，不激活任何事件或交互逻辑。
dialog.returnValue 怎么读、什么时候能读到值
dialog.returnValue 是 dialog 元素自身的属性，不是事件对象上的字段。你不能在 event 里找它，只能在 close 事件回调中直接读取 dialog.returnValue。
立即学习“前端免费学习笔记（深入）”；
它的值取决于你如何调用 close()：
-
dialog.close('confirmed')→dialog.returnValue === 'confirmed' -
dialog.close('canceled')→dialog.returnValue === 'canceled' - 按 Esc 关闭 →
dialog.returnValue === ''（空字符串） - 点击 backdrop 关闭 →
dialog.returnValue === '' - 用
formmethod="dialog"的按钮提交 →dialog.returnValue是该按钮的value属性值（如<button value="yes">确定</button>）
注意：dialog.returnValue 在 close 事件触发前就已写入，但别在 close() 调用后立刻读——虽然属性同步更新，但事件还没派发，逻辑上应统一放在 close 回调里处理。
为什么点了遮罩或按 Esc 后 returnValue 是空字符串
因为原生 dialog 对这两种关闭方式不做语义区分，它们都属于“非受控关闭”，不带参数。如果你需要明确区分“用户点了取消按钮”和“用户点了遮罩”，就得自己控制：
- 禁用 backdrop 点击关闭（移除
e.target === dialog的监听） - 把取消按钮绑定为
dialog.close('canceled')，确认按钮绑定为dialog.close('confirmed') - Esc 关闭默认也返回空字符串；若想阻止 Esc，需监听
cancel事件并event.preventDefault()
别指望靠 returnValue 判断是否点了遮罩——它和 Esc 是同一类行为，返回值完全一致。真要区分，得结合 cancel 事件（仅 Esc 触发）和自定义点击 backdrop 的逻辑（需手动监听 click 并判断 e.target）。
close 事件回调里再调 close() 会报错
在 close 事件处理函数中调用 dialog.close()，浏览器会抛出 Failed to execute 'close' on 'HTMLDialogElement': The element does not have an 'open' attribute.。因为 close() 是同步清除 open 属性的，事件触发时关闭流程已开始，再次调用即对已关闭元素操作。
典型踩坑场景：
- 在
close回调里做清理，顺手又写了个dialog.close() - 多个地方监听了同一个 dialog 的
close，其中一个处理完又调了一次close()
正确做法：把清理逻辑（如重置表单、释放资源）放进去，但别再调 close()。它已经关了，再关没意义，还会报错。
