为什么不能以相同的方式将函数()绑定到onload事件和resize事件?

时间:2018-09-05 21:28:21

标签: javascript

为什么不能以相同的方式将函数()绑定到onload事件和resize事件?

我想将自己的函数绑定到javascript的onresize和onload事件。

这是.JS文件中的测试代码。
我通过使用两种不同的方式将函数绑定到事件上来使其工作。 而且效果很好。

window.addEventListener('resize', function() {
  alert (“Hi from resize”);
}

window.onload = function () {
  alert (“Hi from onload”);
}

但是,当我尝试使用相同的方式绑定它们时,总是会失败。即这些都不起作用:

window.resize = function () {
  alert (“Hi from resize”);
}

window.addEventListener('onload', function() {
  alert (“Hi from onload”);
}

我发现了无数关于如何使特定示例以一种或另一种方式工作的文章。

但是我找不到任何暗示为什么相同的方式不能同时适用于两者的任何信息。

有人可以帮我解决这个问题吗?

---有人写道,首选addEventListener()。而且直接分配不是。是真的吗?

---对于两个事件,直接分配是否仍然有效?

--- addEventListener()是否应同时适用?

---我还有其他我应该知道的东西吗?

我的意思是我拥有的代码工作正常。只是不一致,而且似乎总是表明我在某个地方搞砸了。

我想这两种方法中的任何一种是否都可以“应对”,我可以回去搜索错别字。但这将有助于知道哪种方法更可取。或者我错过了重要的事情。

谢谢。

2 个答案:

答案 0 :(得分:4)

在第二个块中将其向后移动。分配给window属性时,名称为on<eventname>;使用addEventListener()时,您只需使用<eventname>。所以应该是:

window.onresize = function() {
    alert("Hi from resize");
};

window.addEventListener("load", function() {
    alert("Hi from resize");
});
出于某些原因,最近首选

addEventListener

  1. 您可以有多个侦听器,这些侦听器在事件发生时全部执行。分配给属性时,它将替换先前的值。如果要删除事件侦听器,则可以有选择地使用removeEventListener(这需要绑定到命名函数,因为删除时需要传递相同的函数)。

  2. 它可以与应用程序定义的自定义事件一起使用; onXXX属性只能与标准事件一起使用。

答案 1 :(得分:1)

最好使用

addEventListener,因为如果分配,则将覆盖已分配给该事件的任何其他事件。

使用addEventListener时onload事件只是“加载”