因为popovertargetaction="show"本质是切换状态，等价于showPopover()的开关逻辑；要只开不关，需移除该属性，用JS调用showPopover()并临时拦截beforetoggle事件阻止关闭。
popover 的 popovertargetaction="show" 为什么点一次开、再点就关？
因为浏览器原生 <dialog popover> 的交互逻辑里，show 并不是“单向打开”，而是“切换显示状态”——它等价于 popover.showPopover()，而这个方法本身会检查当前是否已显示，已显示就调用 hidePopover()。所以你设 popovertargetaction="show"，按钮天然具备开关功能。
想只开不关，得绕过默认 toggle 行为
核心思路：不用 popovertargetaction，改用 JS 显式调用 showPopover()，并阻止后续关闭触发。关键点有三个：
- 把按钮的
popovertarget和popovertargetaction全部去掉，否则浏览器会接管并强制 toggle - 用
click事件监听器调用popoverElement.showPopover() - 在 popover 内部或 document 级别拦截
click或blur导致的自动隐藏（比如点击外部、按 Esc）
示例：
Article To Html
下载
文章转信息图。将文章/笔记转化为手机可读的 HTML 信息图，自动匹配视觉风格。触发场景：文章转图、笔记转图、信息图、转小红书图、做张图、可视化这篇文章、文生图。
<button id="openBtn">只打开</button>
<div id="myPopover" popover>内容</div>
<script>
const btn = document.getElementById('openBtn');
const popover = document.getElementById('myPopover');
btn.addEventListener('click', () => {
popover.showPopover();
// 阻止点击外部时自动关闭
popover.addEventListener('beforetoggle', (e) => {
if (!e.isOpen) e.preventDefault(); // 关闭前拦住
}, { once: true });
});
</script>
beforetoggle 拦截要加 { once: true }
因为 beforetoggle 是每次开关前都触发的事件，如果你不加 { once: true }，后续手动调用 hidePopover()（比如你想加个「X」按钮）也会被拦住，反而无法关闭。只在 show 后临时拦截一次，才能保证“首次打开后不自动关”，又保留未来可控关闭的能力。
立即学习“前端免费学习笔记（深入）”；
注意：Esc 键和点击 backdrop 仍可能关闭
目前 Chrome/Safari 对 popover 的 preventDefault() 支持不一致：beforetoggle 能拦住脚本触发和部分用户操作，但 Esc 键在部分版本中仍会强制关闭，且点击半透明 backdrop 区域（如果用了 popover="auto"）也可能绕过拦截。真正可靠的只开不关，往往需要配合 inert + 手动管理焦点 + 自定义遮罩层——也就是说，原生 popover 的“只开”是妥协方案，不是设计目标。
