将 url 添加到 <a> 标签上的 href 但不想重新加载行为

Question

以下代码在新 window 上打开锚标记但是，我不想重新加载父页面。我还希望能够在鼠标右键单击时在新选项卡中打开（下图）

如果我使用 href = {'javascript:'} 它会阻止父页面重新加载但是，当单击“在新选项卡中打开”时，它会在新选项卡上打开但 url 变为 about:blank#blocked

const handleClick = () => {
      window.open(
        href,
        'newwindow',
        `width=${window.outerWidth * 0.5}, height=${
          window.outerHeight
        }, left = ${window.outerWidth * 0.25} `
      );
      return false;
  };

<a href = {href} onClick = {handleClick}> This is Url </a>

想要的结果：

默认情况下，在新 window 中打开。
阻止父 window 刷新。
可以在右键单击时在新选项卡上打开。

Answer 1

要在新 window 或新标签页中打开 link，您可以在锚标记中使用目标属性，即 <a href="https://example.com" target="_blank">...</a>

Answer 2

为此你需要 target="_blank"。

<a href="www.google.com" target="_blank">Click</a>

将 url 添加到 <a> 标签上的 href 但不想重新加载行为

Add url to href on <a> tag but do not want to reload behavior

html

javascript

anchor

dom-events