href 属性中 jQuery 代码的奇怪行为

Strange behavior of jQuery code in the href attribute

我看到可以在 html a 标签的 href 属性中放置 jquery 代码。

然而,该代码有效,所以我不明白:它在第二次点击后有效。 为什么?

<a href="javascript:alert('ok JavaScript')">JS</a>
<br>
<script src="https://code.jquery.com/jquery-latest.min.js"></script>
<a id="myId" href='javascript:
  $(document).ready(function(){
    $("#myId").click(function() {
      alert("ok jQuery");
    });
  });'>jQ</a>

这种行为没有什么奇怪的。
一开始没有 jQuery click 处理程序绑定到您的 link。

但是,当您第一次点击它时,它会从其 href 执行以下脚本:

$(document).ready(function() { 
  $("#myId").click(function() {
    alert("ok jQuery");
  });
});

并将处理程序绑定到您的 link。 所以,在第一次点击后你没有 alert,但你现在有一个 click 处理程序绑定到你的 #myId

当您第二次单击它时,它会触发新绑定的 jQuery 事件,显示警报。
此外,它会再次执行 href,因此当您再次单击此 link 时,您将获得两个(相同的)点击处理程序和两个警报,每次警报的数量都会增加。

第一次点击定义了显示警告框的点击事件。

第二次点击执行代码并显示警告框。

如评论所述,您不应将此代码包含在 href 属性中,因为这是一种不好的做法。

在第一次点击时,href 属性中的函数被执行,处理程序被绑定到 'myId' 锚元素。在第二次单击处理程序中执行并显示警报。