Question

<script type="text/javascript">
function ChangeStyle()
{
    document.getElementById("p1").innerHTML = 
        "<a href='javascript:void()' onclick=\"window.location.href='http://google.com'\">The New Link</a>";
}
</script>
<a id="p1" href="javascript:void()" onclick="ChangeStyle();alert('hello');">The Link</a>

这是完整的代码。出于某种原因，警报会两次触发。我无法弄清楚。

Answer 1

通过设置链接的innerHTML，您将在第一个链接中创建另一个链接。

单击此内部链接时，单击事件会冒泡并触发外部单击处理程序。

Answer 2

您可能打算将链接包装到另一个元素中：

<span id="p1">
 <a href="javascript:void()" onclick="ChangeStyle();alert('hello');">The Link</a>
</span>

现在，您可以按照预期的方式使用p1替换innerHTML的内容：

<script type="text/javascript">
function ChangeStyle()
{
  document.getElementById("p1").innerHTML = "<a [...]>The New Link</a>";
}
</script>

否则，您正在链接中创建链接

为什么这个javascript警报会两次开火？

2 个答案: