bootstrap 5 中使用 `data-bs-trigger=”click”` 的 popover 默认不支持点击外部关闭，需改用 `focus` 触发方式并添加 `tabindex=”0″`，配合原生焦点管理机制实现点击外部自动隐藏。
要让 bootstrap 5 的 popover 在点击外部区域时自动关闭，关键在于利用浏览器原生的 focusout 行为，而非依赖手动监听 document.click（该方式易出错且与 Bootstrap 5 的 Popover 实例管理冲突）。Bootstrap 官方推荐且最稳定的方式是将触发方式从 “click” 切换为 “focus”，并确保元素可获得焦点。
✅ 正确做法如下：
- 为触发元素添加 tabindex=”0″：使其成为可聚焦的 html 元素；
- 将 data-bs-trigger 改为 “focus”：此时 popover 会在元素获得焦点时显示，失去焦点（如点击外部、按 Tab 键离开或点击 popover 内容）时自动隐藏；
- 无需额外 javaScript 监听 click 事件——避免与 Bootstrap 内部事件逻辑冲突（你之前尝试的 jquery $(document).on(‘click’, …) 方案在 Bootstrap 5 中失效，因其 Popover 实例已不再暴露 .popover(‘hide’) 方法，且 dom 结构变更导致 $(‘.popover’) 选择器不可靠）。
? 修改后的 HTML 示例：
? 注意事项：
- tabindex=”0″ 是必需的——没有它，元素无法被聚焦，focus 触发器将无效；
- data-bs-trigger=”focus” 同时支持鼠标点击和键盘操作（如 Tab 进入、Esc 关闭），符合无障碍（a11y）标准；
- 若 popover 内含链接（如你的 URL），请确保链接 target=”_blank” 或使用 rel=”noopener” 提升安全性；
- 不建议混用 click 和 focus 触发逻辑，也不推荐手动调用 hide()；Bootstrap 5 的 Popover 类已移除 jQuery 依赖，应始终使用 bootstrap.Popover 实例化。
✅ 初始化脚本（保持不变，但需确保在 DOM 加载后执行）：
? 小结：与其“修补”点击外部关闭的逻辑，不如顺应 Bootstrap 5 的设计范式——用 focus 触发 + tabindex 实现开箱即用的失焦关闭行为，简洁、可靠、无障碍友好。