JavaScript Event事件对象获取方法详解

作者:交互手记时间:2026-10-25 15:38:15浏览:462

本文介绍在JavaScript中获取Event事件对象的统一方法,重点解析如何通过window.event及函数调用栈(caller/arguments)兼容不同浏览器环境。针对YUI源码中关于Event与MouseEvent构造函数的判断逻辑进行说明,并提供完整的代码实现示例,帮助开发者解决事件对象获取的兼容性问题。

 <html> <head> <title></title> </head> <body> <div id="contentq" onclick="bb(event)"><!--显示传入event对象--> fasdf </div> </body>  </html> 

注意:若引入外部JavaScript文件,需刷新页面后方可执行相关代码。


获取事件对象的统一方法

以下是从网络资源整理得到的获取事件对象的统一方法。


// 复制代码

具体实现代码如下所示:

 
核心代码实现function getEvent(event) {
var ev = event || window.event;
if (!ev) {
var c = this.getEvent.caller;
while (c) {
ev = c.arguments[0];
if (ev && (Event == ev.constructor || MouseEvent == ev.constructor)) { // 注:YUI源码存在BUG,ev.constructor也可能是MouseEvent,不局限于Event
break;
} 
c = c.caller;
} 
} 
return ev;
} 

调用示例

调用该函数的执行示例如下:


// 复制代码

代码如下:

 
function foo(){
var e = getEvent();
alert(e);
} 
作者最新文章