默认情况下，使用 href="#" + onclick 的 PDF 链接无法触发浏览器原生的右键菜单（如“在新标签页中打开”），正确做法是直接将 PDF URL 设为 href 属性值，并添加 target="_blank"。

默认情况下，使用 `href="#"` + `onclick` 的 pdf 链接无法触发浏览器原生的右键菜单（如“在新标签页中打开”），正确做法是直接将 pdf url 设为 `href` 属性值，并添加 `target="_blank"`。

要使 PDF 链接真正支持右键“在新标签页中打开”，关键在于回归语义化 HTML 原则：避免用 href="#" 阻断浏览器默认行为，而是让 <a></a> 标签承担其本职——导航到资源地址。

✅ 正确写法（推荐）：

<a class="pdf-link" href="https://www.africau.edu/images/default/sample.pdf" target="_blank" rel="noopener noreferrer">
  Open PDF in New Tab
</a>

⚠️ 为什么原代码失效？

• href="#" 是空锚点，浏览器无实际目标 URL，右键菜单中“在新标签页中打开”选项会失效或跳转到当前页面；
• onclick="showPDF(...)" 是 JavaScript 行为，仅响应左键点击，不参与右键上下文菜单逻辑；
• iframe.src 动态赋值属于前端渲染，对右键菜单完全不可见。

? 进阶提示：

• 若仍需保留内嵌预览（如通过 iframe 显示在当前页），可同时支持两种交互：
  • 左键点击 → 调用 showPDF() 实现内嵌展示；
  • 右键/中键/Ctrl+Click → 浏览器自动按 href 打开 PDF（无需额外 JS）。
    实现方式如下：

    <a class="pdf-link" href="https://www.africau.edu/images/default/sample.pdf" target="_blank" onclick="showPDF(this.href); return false;" rel="noopener noreferrer">
    View PDF (click for preview, right-click for new tab)
    </a>

    此处 return false 阻止左键默认跳转，但保留右键原生行为。

? 安全注意：始终为 target="_blank" 添加 rel="noopener noreferrer"，防止新开页面通过 window.opener 访问原始页面，规避潜在安全风险。

总结：优先使用原生 <a href="..."></a>，而非 href="#" + JS 导航——它更可靠、更可访问、更符合用户预期，且天然兼容右键菜单、书签、拖拽保存等浏览器基础能力。