Javascript 事件对象是如何工作的? window.onload=unblurMonaLisa; 蒙娜丽莎()函数{ var images=document.getElementsByTagName(“img”); 对于(var i=0;i

Javascript 事件对象是如何工作的? window.onload=unblurMonaLisa; 蒙娜丽莎()函数{ var images=document.getElementsByTagName(“img”); 对于(var i=0;i,javascript,javascript-events,Javascript,Javascript Events,上述代码将模糊图像切换为单击所述图像时未模糊的图像。代码运行得很好。我的问题是关于传递给showAnswer函数的“eventObj”。此代码中的“eventObj”是何时创建的?“eventObj”的范围是本地的吗?如果我将onclick事件分配给两个不同的变量,会创建两个“eventObj”吗?如果是,我将如何分别访问它们 此代码中的“eventObj”是何时创建的 当您感兴趣的事件发生时,在本例中单击,您的回调函数将由环境自动执行。执行回调函数时,它会被赋予一个事件对象作为参数,您可以选择

上述代码将模糊图像切换为单击所述图像时未模糊的图像。代码运行得很好。我的问题是关于传递给showAnswer函数的“eventObj”。此代码中的“eventObj”是何时创建的?“eventObj”的范围是本地的吗?如果我将onclick事件分配给两个不同的变量,会创建两个“eventObj”吗?如果是,我将如何分别访问它们

此代码中的“eventObj”是何时创建的

当您感兴趣的事件发生时,在本例中单击
,您的回调函数将由环境自动执行。执行回调函数时,它会被赋予一个
事件对象
作为参数,您可以选择在函数签名中忽略它。(即,您的
showAnswer
函数可以是这样的
函数showAnswer(){…}
)。
事件对象
是一个常规对象,它保存关于刚刚发生的事件的信息

“eventObj”的范围是本地的吗

是的

如果我将onclick事件分配给两个不同的变量

不能使用
.onclick
添加两个不同的回调函数。如果要向同一事件添加多个回调函数,应使用
addEventListener()

这会创建两个“eventObj”吗?如果会,我将如何分别访问它们

为该事件创建的事件对象将仅为一个,并将传递给所有回调函数

有关活动的更多信息,请阅读以下内容:

另外,请查看问题的答案,答案与此类似

更新:

要回答您的评论:

无论是否有处理程序侦听该事件,浏览器都会在每次事件发生时创建一个唯一的事件对象

我们可以将这个唯一的对象传递给我们的处理程序

请再说一遍

我注意到在你的另一篇文章中,他们用“e”代替“eventObj”

您可以在函数中随意命名它。只要你把一些东西作为你的函数参数(
function(e){}
),你的函数就会接受事件对象


人们通常将该参数命名为
e
,缩写为
event
,或
event
,以指示该参数是什么类型的,但您可以随意命名,就像任何其他函数的任何其他参数一样。

是一个本机接口,它实际上不是由任何东西创建的,它神奇地作为一个对象参数存在于所有事件中。可能是Ok的重复,所以我要尽我所能地清除它。无论是否有处理程序侦听该事件,浏览器都会在每次事件发生时创建一个唯一的事件对象?我们可以通过参数eventObj将这个唯一的对象传递给我们的处理程序?我注意到在你的另一篇帖子中,他们用“e”代替“eventObj”,你能告诉我什么是最佳实践吗?我的评论太长,添加到了答案中。更新了我的答案,请查看。谢谢,我现在明白了。由于您的解释,我能够将创建的对象console.log记录下来,这让我对在单个事件中实际可以访问的内容有了一些不可思议的了解。很酷!谢谢我很高兴我帮助了你!
window.onload = unblurMonaLisa;

function unblurMonaLisa() {
  var images = document.getElementsByTagName("img");
  for (var i = 0; i < images.length; i++) {
    images[i].onclick = showAnswer;
  } 
};

function showAnswer(eventObj) {
  var image = eventObj.target;
  var name = image.id;
  name = name + ".jpg";
  image.src = name;
};