【发布时间】:2011-09-19 13:39:03
【问题描述】:
我只是在玩弄 DOM 和 Javascript 的事件侦听器,并确实注意到了这一点:
function chained(msg) {
console.log(msg, event);
}
function onClick() {
chained('the body was clicked');
}
document.body.addEventListener('click', onClick);
现在有趣的是......这将输出:
"body 被点击,(MouseEvent)"
那我问,为什么?它如何传递事件对象而不在chained 调用中发送它?
function chained(msg) {
console.log(msg, namedEventObj); //throw error namedEventObj is not defined
}
function onClick(namedEventObj) {
console.log(event); //outputs (MouseEvent);
console.log(nameEventObj); //outputs (MouseEvent);
chained('the body was clicked');
}
document.body.addEventListener('click', onClick);
即使我将要在 onClick 函数上传递的事件 obj 声明为 namedEventObj,它也只能用于 onClick 而不能用于 chained 函数...我明白了,这对我来说很有意义...但绝对不是 event 变量可用于 chained 函数。
有人知道它为什么会这样吗?
我唯一能想到的是事件实际上是window.event 并且当某些事件调度和事件时它使自己可用...但这意味着任何元素都可以获得该事件信息如果同时调用触发事件的时间?
我使用的是 Chrome 11.0.x
【问题讨论】:
-
You are right (
window.event),不知道还有什么好说的。当然,您可以从任何地方访问全局变量(这就是它们是全局的原因)。 -
感谢 Felix,我同意我只是认为创建此 "shortcut" 有点令人困惑,因为当您使用
function(event)时,您认为您正在发送它而不是它已经自动发送,并且不会给人以它将通过所有链接功能传播的印象。所以我相信window.event很容易理解为全局...但不是event,它在大多数情况下与您传递的属性名称一致,但这无法完成,因为无论如何一切都已经在窗口内...并继承 :( 只是检查了它在 Gecko 中没有发生,但在 webkit 中仍然存在 -
这可能会令人困惑。但是如果在当前名为
event的函数中没有参数或变量,您就知道它必须来自更高的范围(在本例中为window)。如果你将它作为event传递,那么你实际上是在访问参数而不是window.event。所以它只是函数的工作原理:) -
我现在已经习惯了:),它似乎是跨浏览功能的一个不错的选择,所以你可以保证它也可以在旧版本的 IE 上工作?感谢Felix的启发。只是第一次觉得很疯狂。
-
关于跨浏览器兼容性:您经常会看到事件处理程序定义为
function(event) { event = event || window.event;}。仅当未定义event时才使用window.event(旧版 IE 浏览器就是这种情况)。window.event在 Firefox 中不起作用。
标签: javascript inheritance scope event-handling dom-events