当我只想打开一个链接时，onclick 功能会打开两个链接答案

【问题标题】：onclick function opening two links when I only want one link to open当我只想打开一个链接时，onclick 功能会打开两个链接
【发布时间】：2021-03-11 15:32:51
【问题描述】：

在我的代码中，我只希望 Google 链接在新选项卡中打开，但是当我单击 Google 链接的按钮（在新选项卡中打开）时，原始选项卡会转到 stackoverflow 页面（甚至虽然它没有被点击）。我不希望当用户仅单击 google 时单击并打开 stackoverflow 按钮的按钮，我希望它保留在我的主页上。任何想法为什么 onclick 会触发两个 URL？

这是我的代码 sn-p：

<div class="btns-A">
  <div><a href="https://google.com" class="btn-A" onclick="window.open(this.href,'_blank');return false;">Go to Google</a></div>

  <div><a href="https://stackoverflow.com" class="btn-A">Go to Stack</a></div>
</div>

【问题讨论】：

好吧，因为您打开链接一次是使用<a> 链接，第二次是使用一些过度杀伤的 Javascript。代码是明确的
使用event.preventDefault()来阻止点击链接的正常动作。
我刚刚更新了代码，但问题仍然存在。为什么一叠也开？

标签： javascript url tabs onclick

【解决方案1】：

使用document.getElementById(x).addEventListener('click', function() {...}); 而不是onclick 事件；
如果您使用带有 href 标记的 <a>，则不需要运行第二个 JS 脚本（<a> 可以很好地打开链接（https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a）

【讨论】：

为什么简单的目标空白在这种情况下不起作用？或<div class="btns-A"> <div><a href="https://google.com" class="btn-A" onclick="window.open(this.href,'_blank');return false;">Go to Google</a></div> <div><a href="https://stackoverflow.com" class="btn-A">Go to Stack</a></div> </div>
为什么要触发与<a> 和onclick 相同的事件？
我只希望第一个链接在新选项卡中打开，但目标空白不起作用，当我应用 onclick 时，它会导致第二个 URL 加载，这是我不想要的。我想我只是把它弄得一团糟。
好的，那我建议你可以这样做：documet.getElementById(yourLinkId).addEventListener('click', function() {window.location.href = "http://www.YourWebPage.com";};这也使您在 <a> 中的 href 过时
也可以看看这篇文章了解更多关于taget='_blank':medium.com/sedeo/…

【解决方案2】：

根据我对您的问题的理解，您可以使用

<a href="https://google.com" target="_blank">Link to Google</a>

你可以找到一些文档here

此处不需要您的 Javascript。

【讨论】：

The target="_blank" 由于某种原因在我的代码中不起作用。
@Anna 在代码中提供了它的工作原理，但如果你在另一个标签内工作，例如 iframe，它可能会导致问题。