Question

我一直在关注例子，但我的小提琴不起作用。这是代码：

  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上放置一个click事件。有谁知道我做错了什么？

P.S。是的，我不知道如何破译或修复错误。

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属性的内容。

次要问题：如果您希望使用屏幕阅读器的盲人用户使用此页面，最好使用<button>或<a>标记。要么你需要模仿使屏幕阅读器正常工作所需的所有东西。

Answer 2

你有几个问题：

您定义了＆＃34; showMessage＆＃34;作为一个空变量，然后尝试将其称为函数，然后将其定义为函数。
onClick与onclick不同。
在尝试将showMessage分配给onclick事件时调用了showMessage，而不是分配函数本身，最后分配了它的（空）返回值。

以下是您的代码的更正版本：

＆＃13;

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

＆＃13;

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

＆＃13;

那个香草JS。由于问题也被标记为＆＃34; jQuery＆＃34;，这里是jQuery版本的同一件事：

$('#myDiv').on("click",function() {alert("you clicked me")});

Answer 3

由于您已经标记了jQuery，我们只会给您jQuery解决方案：

$('#myDiv').click(showMessage);

但请确保在jQuery点击事件绑定之前（上方）设置showMessage函数。

HTML和JavaScript - 如何向div添加click事件

3 个答案: