如果单击打开新选项卡或窗口，则禁止单击事件侦听器

Question

有时在我的网络应用程序上，如果点击应该打开一个新窗口或标签，我想禁止点击事件侦听器。例如，我的单页应用程序具有指向另一个内容的链接。他们工作得很好，但有一个问题。如果用户单击此类链接，进行特殊单击以打开新选项卡/窗口（比如说 cmd ⌘ + 在 Mac 上单击），我不想触发事件侦听器。

通常我会这样做：

<a href="/music">Music</a>
<a href="/games">Games</a>
<a href="/about-us">About Us</a>
<a href="/contact">Contact</a>

还有一些 jQuery 魔法：

$("a[href]").click(event => {
    if (event.metaKey || event.shiftKey) {
        // Let browser handle that normally if cmd or shift is pressed
        return true;
    }

    let uri = $(event.target).attr("href");

    // My viewPage(uri) function displays content by href
    viewPage(uri);

    return false;
});

它按预期工作 - 每当使用鼠标 + 键盘快捷键打开新选项卡/窗口时，当前选项卡不受影响并出现新选项卡/窗口。

这里的问题是假设 cmd ⌘ + click 或 shift + click 实际上是快捷方式。对于不同的浏览器和系统，它们可能会有所不同。

所以这是我想问的问题：有没有可靠的方法来检测 JavaScript 中的选项卡/窗口打开请求？我发现这个功能相当重要。至少重要到可以关心。

Answer 1

不要让它们成为锚。使它们成为跨度，并使用跨度的单击事件来设置window.location。这比找到每个人想要在新窗口中打开内容的边缘情况要容易得多——例如，右键单击链接、复制链接位置、打开新选项卡/窗口并粘贴？你永远无法用锚标签来防止这种情况发生。