cancel事件无法通过preventdefault()阻止esc关闭，它是通知事件而非可拦截事件；esc关闭仅在showmodal()激活且dialog有焦点时生效，需从控制激活时机、聚焦策略等源头防范。

html-ppt-to-pdf

将使用 `

` 约定的 HTML 幻灯片转换为高保真、矢量文本 PDF（使用 Playwright + Chromium 原生 PDF 功能）。

下载

监听 cancel 事件并调用 preventDefault()

被 Esc 键触发关闭时，浏览器会先派发 cancel 事件，再派发 close 事件。阻止 Esc 关闭的关键不是拦截 close，而是阻止 cancel 的默认行为。

• 必须在 cancel 事件回调中立即调用 e.preventDefault()
• cancel 事件只在用户按 Esc 或点击 backdrop（遮罩）时触发，不包含 dialog.close() 显式调用
• 如果没加 e.preventDefault()，即使监听了该事件，Esc 仍会关闭弹窗

dialog.addEventListener('cancel', (e) => {
  e.preventDefault(); // 这行不能少
});

showModal() 是前提，open 属性无效

<dialog open></dialog> 不等于模态弹窗：它只是让内容“可见”，但无遮罩、无焦点锁定、Esc 不生效、点击 backdrop 也不关闭。

• 模态行为（含 Esc 支持）只由 showModal() 触发
• show() 几乎没用，它不加遮罩、不限制 Tab、不拦截背景交互
• 若 DOM 尚未就绪就调用 showModal()，会报错 Cannot read property 'showModal' of null
• 确保脚本在 DOMContentLoaded 后执行，或把 <script></script> 放在

前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！