event事件对象

最新推荐文章于 2024-07-22 09:19:24 发布

weixin_34138521

最新推荐文章于 2024-07-22 09:19:24 发布

阅读量51

点赞数

CC 4.0 BY-SA版权

原文链接：https://yq.aliyun.com/articles/384648

本文深入探讨了事件对象的概念及其在不同浏览器环境下的表现，包括IE与标准浏览器之间的差异。通过实例展示了如何在事件函数中正确使用事件对象，以及如何实现事件对象的兼容性处理。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
<script>
/*
event : 事件对象 , 当一个事件发生的时候，和当前这个对象发生的这个事件有关的一些详细的信息都会被临时保存到一个指定地方-event对象，供我们在需要的调用。

事件对象必须在一个事件调用的函数里面使用才有内容
事件函数：事件调用的函数，一个函数是不是事件函数，不在定义的决定，而是取决于这个调用的时候

兼容
ie/chrome : event是一个内置全局对象
标准下 : 事件对象是通过事件函数的第一个参数传入

如果一个函数是被事件调用的那么，这个函数定义的第一个参数就是事件对象
*/

alert( event );    //这里没有事件,event不在事件调用函数中使用
document.onclick = alert( event )；//这里没有事件,event不在事件调用函数中使用
document.onclick = function() {
    alert(event);//这里有事件,event在事件调用函数中使用
};

function fn1(ev) {
    alert( event );//event在火狐没有定义
    alert( ev );//ev在火狐有定义,这时标准的写法，非标准ie中ev没有定义
    var ev = ev || event;//兼容标准个非标准事件写法
    alert(ev);
    for ( var attr in ev ) {
        console.log( attr + ' = ' + ev[attr] );
    }
    alert(ev.clientX);
}

fn1();    //事件没有发生，ev没有内容，不是事件调用的函数
document.onclick = fn1;    //是事件调用的函数，所以event有内容
</script>
</head>

<body>
</body>
</html>