当前位置: 首页 > 图文教程 > 网络编程 > Javascript > JavaScript Event学习第六章 事件的访问

Javascript
JavaScript 基础问答一
CSS JavaScript 实现菜单功能 改进版
JavaScript 图片切割效果(放大镜)
JavaScript 拖放效果代码
漂亮的js tab图片轮换效果代码(可自定义的幻灯片和图片缓冲切换)
鼠标滑过 放大显示效果的列表
JS 相册效果 自动播放[本地整合]
仿CSDN 右下角悬挂的浮动层效果
右下角广告(点击广告后出现关闭按钮可关闭)
javascript this用法小结
JavaScript 绘图代码
JavaScript CSS菜单功能 改进版
javascript jQuery插件练习
jQuery 浮动广告实现代码
jQuery 位置插件
jquery 插件之仿“卓越亚马逊”首页弹出菜单效果
jquery 图片预加载 自动等比例缩放插件
JavaScript 仿关机效果的图片层
javascript 对表格的行和列都能加亮显示
JavaScript Select和Option列表元素上下左右移动

Javascript 中的 JavaScript Event学习第六章 事件的访问


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2010-02-27   浏览: 132 ::
收藏到网摘: n/a

在这一章我会讲解如何去访问一个事件对象。 现在我们已经注册了事件处理程序,对于事件我们还想更深入的了解。我们想知道事件发生时候的鼠标位置,我们想知道用户按下了哪些键。这些都是可能的,虽然这部分有很多烦人的浏览器兼容性问题。(这里可以快速查看浏览器兼容性列表)。
要读出事件的属性,必须要先能访问到事件。
浏览器兼容性
站在浏览器战争的角度看,Netscape实现了一个访问模型(后来被W3C做借鉴)和很多的事件属性,同时微软也做了同样的事情。当然这两种模型是完全不兼容的。但是就像我们再简介里面说的,如果
复制代码 代码如下:

if (W3C/Netscape) {
use W3C/Netscape model for access and property names
}
else if (Explorer) {
use Microsoft model for access and property names
}

这样是不正确的解决兼容性问题的办法,他会让一些能执行大部分代码但是没有考虑到的浏览器失去作用。所以我们得先访问一个事件然后再分别读取他的属性。
我们先来讨论访问事件的问题,事件属性会在后面讨论。
W3C/Netscape
在W3C/Netscape事件访问模型中事件会被当做一个参数传递给事件处理程序。所以如果你定义一个事件处理程序
element.onclick=doSomething;
doSomething()就会把事件当做一个参数。习惯上保存在一个e变量中,当然你可以改成任何名字:
复制代码 代码如下:

function doSomething(e) {
// e gives access to the event
}

这是完全自动的,不需要其他的代码。在匿名函数中你可以这样写:
element.onclick = function (e) {alert('Event type is ' + e.type)}
微软
在微软的事件访问模型中有一个特别的属性window.event包含最后一个发生的事件。
复制代码 代码如下:

element.onclick = doSomething;
function doSomething() {
// window.event gives access to the event
}

或者
复制代码 代码如下:

element.onclick = function () {alert('Event type is ' + window.event.type)}

Event和event
注意到还有一个古老的Netscape属性window.Event。IE不认识这个,Netscape 4也会曲解他。所以写的时候一定要确保event是小写e开头的。
跨浏览器的事件访问
很幸运的是要写跨浏览器访问事件的脚本还是很简单的:
复制代码 代码如下:

element.onclick = doSomething;
function doSomething(e) {
if (!e) var e = window.event;
// e gives access to the event in all browsers
}

如果e不存在那么就给他赋值window.event。现在e在所有浏览器里面都表示事件。
与内联式的事件处理程序合并
在内联式的注册模型中,你必须把event传递给函数:
复制代码 代码如下:

<pre onclick="doSomething(event)">
function doSomething(e) {
alert(e.type);
}

虽然在微软模型里(window.)event是正确的属性,其他浏览器也能识别。
继续
如果你想继续学习,请看下一章。
原文地址:http://www.quirksmode.org/js/events_access.html
第一次翻译 大家多包含 我的twitter:@rehawk