Question

我有以下HTML代码：

<div onclick="window.open('http://example.com')" >
<p>1234 Main St, New York, NY</p>
<p>Price: $200,000/p>
<p>4 Beds / 3 Baths</p>
<p>2000 sqft</p>
<a href="http://example.com">More Info</a>
</div>

如果此人悬停在不是超链接的DIV部分上，则只会打开一个窗口。

如果此人点击DIV中的超链接，则会打开2个窗口（一个用于DIV，另一个用于超链接）。

这个2x开启窗口情景有什么办法吗？

Answer 1

简单的解决方案：

<a href="http://example.com" onclick="return false;">More Info</a>

Answer 2

您可以通过将链接转换为带有css

的块元素来使div可单击

div a {
    display: block;
}

Answer 3

那是因为点击事件冒泡了。它在你点击锚元素时启动，而不是冒泡到div，并执行它。

你需要捕获div中的click事件（使用函数），然后调用事件的stopPropagation方法来阻止它冒泡。

有关事件冒泡的更多信息：http://www.quirksmode.org/js/events_order.html

Answer 4

您可以在DIV和A HREF中使用相同的功能，并管理该功能内部的开启只调用一次窗口，这将起作用。

编辑：如果你至少关心搜索引擎优化，你不应该使用该标题作为链接，但更多的东西提到下一页的内容，如“众议院细节”或更好，取决于上下文/外观页面。

Answer 5

我遇到了同样的问题，请不要笑我的愚蠢错误。但是有两个标签正在打开，因为我有一个链接并且有一个target ='_ blank'并且同样也调用了一个函数：

<pre>
$('#foo').on('click',function(){
// some code
window.open("https://www.google.com","_blank");
});

我还将目标添加为_blank。我从锚中删除了目标属性，它对我来说很好。希望你不要这样做。

HTML：当有人点击我网站上的链接时，浏览器会打开2个标签？

5 个答案: