Firefox下的event对象

最新推荐文章于 2019-03-31 16:56:27 发布

Legend1988

最新推荐文章于 2019-03-31 16:56:27 发布

阅读量4.7k

点赞数 1

分类专栏： js 文章标签： firefox function 浏览器百度 button opera

本文链接：https://blog.csdn.net/legend1988/article/details/6982535

版权

js 专栏收录该内容

8 篇文章 0 订阅

订阅专栏

有时候在某个事件被触发时，我们希望能得到事件对象本身。IE下很简单，用window.event来代表事件对象，经测试，chrome、opera也支持window.event，所以在这几个浏览器下推荐使用window.event，简单！

但是Firefox并不支持window.event，而是把事件对象作为第一个参数传给事件处理函数，显式或者隐式传递都可以，IE9既支持window.event又支持Firefox下的事件对象。例如：

<input type="button" id="btn" value="click me" />
<script type="text/javascript">
document.getElementById("btn").onclick = function(e){
     alert(e.type);  //"click"
};
</script>

<input type="button" id="btn" value="click me" />
<script type="text/javascript">
document.getElementById("btn").onclick = function(){
     alert(arguments[0].type);  //“click”
};
</script>

但事情没那么简单（这也是推荐使用window.event的原因），当在标签内定义事件响应函数时又是另一回事了。这里借用论坛上一个帖子，楼主想点击链接时改变窗口的背景颜色并取消默认的处理程序（载入新的网页）：

<html>
<body bgcolor="#FFFFFF">
<div><a href="http://www.baidu.com" onClick="a();return false;">百度！</a></div>
<script type="text/javascript">
function a()
{
    document.body.bgColor="#669900";
}
</script>
</body>
</html>

return false可以取消默认的事件处理程序，上面的做法自然是可以的。取消默认的事件处理函数还可以用preventDefault（支持传递事件对象的浏览器下使用）和returnValue（支持window.event对象的浏览器下使用）。所以上面的程序又可以改为：

<html>
<body bgcolor="#FFFFFF">
<div><a href="http://www.baidu.com" onClick="a()">百度！</a></div>
<script type="text/javascript">
function a()
{
    document.body.bgColor="#669900";
	if (arguments[0]&&arguments[0].preventDefault) {
		arguments[0].preventDefault();
	} else {
		window.event.returnValue = false;
	}
}
</script>
</body>
</html>

但此时你会发现上面的程序在Firefox下是无效的！不是说Firefox下会将事件对象作为第一个参数传递给处理函数吗？但要说明的是（不知道原因），标签内定义的事件处理程序里如果用的是封装好的函数是无法访问event对象的，arguments[0]也不行，除非直接用js语句作为标签内的事件处理程序，例如以下的的程序在Firefox下也是正常的：

<html>
<body bgcolor="#FFFFFF">
<div><a href="http://www.baidu.com" onClick="document.body.bgColor='#669900';  //onClick直接用js语句
	if (arguments[0]&&arguments[0].preventDefault) {
		arguments[0].preventDefault();
	} else {
		window.event.returnValue = false;
	}">百度！</a></div>
</body>
</html>

但是封装成函数就不行了，像下面的程序在Firefox也达不到想要的效果：

<html>
<body bgcolor="#FFFFFF">
<div><a href="http://www.baidu.com" onClick="(function(){document.body.bgColor='#669900';  //封装成函数
	if (arguments[0]&&arguments[0].preventDefault) {
		arguments[0].preventDefault();
	} else {
		window.event.returnValue = false;
	}})()">百度！</a></div>
</body>
</html>

综上所述，在Firefox下访问event对象的话有两种方式，要么在js里定义事件处理程序，如果要在标签内定义事件处理程序的话那么不能封装成函数，而且只能用arguments[0]表示。

Legend1988

关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
1
评论
Firefox下的event对象

有时候在某个事件被触发时，我们希望能得到事件对象本身。IE下很简单，用window.event来代表事件对象，经测试，chrome、opera也支持window.event，所以在这几个浏览器下推荐使用window.event，简单！但是Firefox并不支持window.event，而是把事件对象作为第一个参数传给事件处理函数，显式或者隐式传递都可以，IE9既支持window.event又支
复制链接

扫一扫