Obtaining the event object
来源:互联网 发布:如何进行wifi网络认证 编辑:程序博客网 时间:2024/05/24 00:58
Obtaining the event object
- W3C way
- Internet Explorer way
- Cross-browser solution
- The inline variant
- Summary
The event object is always passed to the handler and contains a lot of useful information what has happened.
One property is generic:
event.type
- type of the event, like “click”
Different types of events provide different properties. For example, the onclick
event object contains:
event.target
- the reference to clicked element. IE usesevent.srcElement
instead.event.clientX / event.clientY
- coordinates of the pointer at the moment of click.- … Information about which button was clicked and other properties. We’ll cover them in details later.
Now our aim is to get the event object. There are two ways.
W3C way
Browsers which follow W3C standards always pass the event object as the first argument for the handler.
For instance:
element.onclick =
function
(event) {
// process data from event
}
It is also possible to use a named function:
1
function
doSomething(event) {
2
// we've got the event
3
}
4
5
element.onclick = doSomething
It is possible to use a variable named event
in markup event handlers:
<
button
onclick
=
"alert(event)"
>See the event</
button
>
This works, because the browser automatically creates a function handler with the given body and event
as the argument.
Internet Explorer way
Internet Explorer provides a global object window.event
, which references the last event. And before IE9 there are no arguments in the handler.
So, it works like this:
1
// handler without arguments
2
element.onclick =
function
() {
3
// window.event - is the event object
4
}
Cross-browser solution
A generic way of getting the event object is:
1
element.onclick =
function
(event) {
2
event = event || window.event
3
4
// Now event is the event object in all browsers.
5
}
The inline variant
Both standards-compilant browsers and IE make is possible to access event
variable in markup handlers.
<
input
type
=
"button"
onclick
=
"alert(event.type)"
value
=
"Alert event type"
/>
For older IE, the handler has no arguments, so event
will reference a global variable, for other browsers, the handler will recieve event as the first argument. So, using event
in markup handler is cross-browser.
Summary
The event object contains valuable information about the details of event.
It is passed as first argument to the handler for most browsers and via window.event
for IE.
So, for a JavaScript handler we’d use:
1
element.onclick =
function
(event) {
2
event = event || window.event
3
4
// Now event is the event object in all browsers.
5
}
And, for a markup handler, just event
will do.
- Obtaining the event object
- Obtaining the Current Location
- 17.1.1.4 Obtaining the Replication Master Binary Log Coordinate
- HTML DOM Event Object
- jquery中event object
- Error while obtaining UI hierarchy XML file: com.android.ddmlib.SyncException: Remote object doesn't
- Timeout expired. The timeout period elapsed prior to obtaining a connection from the pool. This ma
- Timeout expired. The timeout period elapsed prior to obtaining a connection from the pool.
- Obtaining CP2K
- timeout expired.then timeout period elapsed prior to obtaining a connection from the pool.……
- 17.1.1.4 Obtaining the Replication Master Binary Log Coordinates 获取复制Master Binary Log的坐标:
- 17.1.1.4 Obtaining the Replication Master Binary Log Coordinates 得到复制master binary log 位置:
- Handle the link event.
- Qt The Event System
- The Event-Dispatching Thread
- [JavaScript]Event Object in FireFox and IE
- C# 4.0 Features Event Object Locking
- Event事件对象之框架或Object
- maven常用命令
- 清除BSS段的一般做法
- UVA1583 - Digit Generator
- mysql数据表最快速迁移,mysql的存储引擎为:myisam
- 时间去哪儿
- Obtaining the event object
- Android Application需要掌握的内容
- sizeof C 实现
- linux连续指令的表达方式
- spring学习之@ModelAttribute运用详解
- 【优秀工具记录】图形化的keytool工具 Portecle
- @autowired和@resource的区别
- 学习OpenGL-ES: 1 - 像素、颜色、显存、初始化
- 脚本控制td显示隐藏