The Event object keeps tracks of various events that occur on thepage, such as the user moving the mouse or clicking on the link, and allowsyou (the webmaster) to react to them.
The Event model and subsequent object is implemented differently in IE andNS/Firefox. Below we‘ll list the related properties and methods separately for the twodivergent models.
In IE, the event object is accessed completely through the explicit object"window.event". It supports the following properties:
| Properties | Description | NS Equivalent? |
|---|---|---|
| altKey, ctrlKey, shiftKey | Boolean properties that indicate whether the Alt, Ctrl, and Shift keys were pressed at time of the event. | Same. |
| button | An integer indicating which mouse button was pressed or released, 1 = left, 2 = right, 4 = middle. If multiple buttons are pressed, the value is the sum of both buttons, such as 3 (1+2) for left and right. | Same, but different return values. |
| cancelBubble | Set to true to prevent the event from bubbling. | stopPropagation() |
| clientX, clientY | Returns the mouse coordinates at the time of the event relative to upper-left corner of the window. Example(s). | Same. |
| fromElement, toElement | For mouseover and mouseout events, these properties indicate the elements the mouse is leaving from and moving onto, respectively. | relatedTarget |
| keyCode | Property indicating the Unicode for the key pressed. Use String.fromCharCode(keyCode) to convert code to string. | charCode |
| offsetX, offsetY | Returns the mouse coordinates relative to the originating element. | N/A |
| returnValue | Set to false to cancel any default action for the event. | preventDefault() |
| srcElement | The element in which the event occurred on. | target |
| type | A string indicating the type of event, such as "mouseover", "click", etc. | Same. |
In NS6+, the event object is accessed by passing an event parameter into theevent handler function in question.
| Properties | Description | IE Equivalent? |
|---|---|---|
| altKey, ctrlKey, metaKey, shiftKey | Boolean properties that indicate whether the Alt, Ctrl, Meta, and Shift keys were pressed at time of the event. | Same, though IE doesn‘t support "metaKey". |
| bubbles | A Boolean value indicating whether or not the event bubbles. | N/A |
| button | An integer indicating which mouse button was pressed or released, 0 = left, 2 = right, 1 = middle. Slightly different in IE, as described above. | Same, but different return values. |
| cancelable | A Boolean value indicating whether or not the event can be canceled. | N/A |
| charCode | Property indicating the Unicode for the key pressed. Use String.fromCharCode(which) to convert code to string. | keyCode |
| clientX, clientY | Returns the mouse coordinates at the time of the event relative to upper-left corner of the window. Example(s). | Same. |
| currentTarget | The node that this event handler is currently being run on. | N/A |
| eventPhase | An integer value indicating which phase of the event flow this event is being processed in. One of CAPTURING_PHASE (1), AT_TARGET (2) or BUBBLING_PHASE (3). | N/A |
| layerX, layerY | Returns the mouse coordinates relative to the container element. (non standard). | offsetX, offsetY |
| pageX, pageY | Returns the left and top coordinates of event relative to the top left corner of the visible page. pageY would return the same value as "window.pageYOffset+e.clientY", for example. | N/A |
| relatedTarget | On a "mouseover" event it indicates the node that the mouse has left. On a "mouseout" event it indicates the node the mouse has moved onto. | fromElement, toElement |
| screenX, screenY | Returns the coordinates of the mouse relative to the screen when the event fired. | N/A |
| target | The node that the event originated from. | srcElement |
| timestamp | Returns the time (in milliseconds since the epoch) the event was created, for example, when a key was pressed (onkeypress). Not all events return a timestamp. | N/A |
| type | A string indicating the type of event, such as "mouseover", "click", etc. | Same. |
| which | NS4/NS6+ legacy property indicating the Unicode for the key pressed. Identical to "charCode", except this property works in NS4 as well.. | keyCode |
| Methods | Description | IE Equivalent? |
|---|---|---|
| preventDefault() | Set to true to cancel any default action for the event. | returnValue |
| stopPropagation() | Set to true to prevent the event from bubbling. | cancelBubble |
This example displays in the status bar the current coordinates of the mouseas it moves:
<script type="text/javascript">
function displaycoordIE(){
window.status=event.clientX+" : "+event.clientY
}
document.onmousemove=displaycoordIE
</script>
This example displays in the status bar the current coordinates of the mouseas it moves, in NS6+:FireFox
eg1:
<script type="text/javascript">
function displaycoordNS(e){
window.status=e.clientX+" : "+e.clientY
}
document.onmousemove=displaycoordNS
</script>
eg2:
<html>
<script>
function tt(e){
alert(e.screenX);
}
</script>
<body >
<input type="button" value="vv" onClick="tt(event)">
</body>
</html>
聯(lián)系客服
