jQuery触发点击锚标签在两个新标签中打开相同的url答案

【问题标题】：jQuery trigger click on anchor tag opening same url in two new tabsjQuery触发点击锚标签在两个新标签中打开相同的url
【发布时间】：2019-06-12 02:55:45
【问题描述】：

单击div 时，我正在尝试触发锚标记并使用jQuery 在新选项卡中打开其URL。它正在工作，但两次打开相同的 URL。

我编写了一些 jQuery 代码来检测对特定 div 的点击并在其锚元素上触发点击事件。当我单击 div 时，它会打开网站的 jQuery 版本，并且 HTML 锚标记也被直接单击。

<div class="website-open">
  <a class="icon--preview" target="_blank" href="http://www.example.com" role="button" rel="noopener noreferrer">
    <img src="myimage.php">
  </a>
</div>

// Js to open website link 
$('.website-open').click(function(e) {
  window.open($(this).find('a').attr('href'));
});

【问题讨论】：

您已经在a 上设置了target="_blank"，以便在新窗口中打开它。 JS是多余的，可以去掉。如果您想让整个 div 可点击，请将 a 元素设置为填充 CSS 中的所有可用空间
@RoryMcCrossan 感谢您的评论。是的，我想通过 Jquery 实现整个 div 可点击。可能您在 html css 级别上修复它是正确的。但我不知道如何设置 a 元素以填充 CSS 中的所有可用空间
将整个 div 包裹在锚标签中，然后删除 JavaScript。
@MdEqbalAhmad a.icon--preview { display: block; width: 100%; height: 100%; } 应该使链接填充 div。
或者 - 删除 target="_blank" 并在点击事件末尾添加 return false。

标签： javascript jquery html

【解决方案1】：

您正在编写脚本以在新选项卡中打开网址，并且您的锚标记也被点击。这就是它打开两次的原因。

只需将您的脚本更改为：

$('.website-open').click(function(e) {
  $(this).find('a').click();
});

【讨论】：