javascript - HTML 和 JavaScript - 如何向 div 添加点击事件

Question

我一直在遵循示例，但我的 fiddle 不起作用。这是代码:

  var showMessage;
  var divTag = document.getElementById("myDiv");
  divTag.onClick = showMessage();
  
  showMessage = function() {
      alert("You clicked me.");
  }

<div id="myDiv" style="height: 100px; width: 100px; background-color: pink;">

</div>

我可能错过了一些愚蠢的东西，但我看不到它。我在这里读到可以在 div 上放置点击事件。有人知道我做错了什么吗？

附注是的，我不知道如何破译或修复错误。

Answer 1

将你的 JS 更改为:

function showMessage() {
  alert("You clicked me.");
}

var divTag = document.getElementById("myDiv");
divTag.addEventListener('click', showMessage);

您的代码:divTag.onClick = showMessage();正在调用函数 showMessage 的响应而不是函数。

showMessage被调用，其返回值 ( undefined ) 是您传递给 onClick 的值属性。

Minor issue: If you want this page to be used by Blind users that use a screen reader it would be better to use a <button> or an <a> tag. Either that or you need to emulate all of the things needed to get the screen readers to work correctly.