event object

Represents the state of an event, such as the element in which the event occurred, the state of the keyboard keys, the location of the mouse, and the state of the mouse buttons.

Document Object Model (DOM) Level 2 HTML Specification, Section 1.6.5

Members

The event object has these types of members:

Properties

The event object has these properties.

PropertyDescription

actionURL

This property is not supported for Windows Store apps using JavaScript.

altKey

Gets a value that indicates whether the Alt key is pressed.

buttonID

This property is not supported for Windows Store apps using JavaScript.

cancelBubble

Sets or retrieves whether the current event should bubble up the hierarchy of event handlers.

constructor

Returns a reference to the constructor of an object.

contentOverflow

Retrieves a value that indicates whether the document contains additional content after processing the current LayoutRect object.

ctrlKey

Gets a value that indicates whether the Ctrl key is pressed.

dataFld

Sets or retrieves the data column affected by the oncellchange event.

 

Standards information

Remarks

The event object is available only during an event—that is, you can use it in event handlers but not in other code.

Although all event properties are available to all event objects, some properties might not have meaningful values during some events. For example, the fromElement and toElement properties are meaningful only when processing the onmouseover and onmouseout events.

Several of the properties that apply to this object are not writable unless this object has been created using the createEventObject method. The following is a list of these properties: altKey, altLeft, button, clientX, clientY, ctrlKey, ctrlLeft, dataFld, offsetX, offsetY, propertyName, qualifier, reason, repeat, screenX, screenY, shiftKey, shiftLeft, srcUrn, type, x, and y.

Examples

This example uses the event object to check whether the user clicked the mouse within a link, and to prevent the link from being navigated if the SHIFT key is down. It also display mouse position within the <body> element:


<!DOCTYPE html>
<html>

<head>
  <meta content="text/html; charset=utf-8" http-equiv="Content-Type">
  <title>Cancels Links</title>
  <style>
    body {
      border: 1px black solid;
      width: 32em;
      padding: 0 1em;
    }
  </style>
</head>

<body id="bodyTag">
  <p>Mouse over this black box (i.e., the &lt;body&gt; element) to see mouse 
  position.
  <p>And click <a href="http://www.bing.com" target="_blank">this</a> link with and without holding the SHIFT key down.</p>
  <p id="mousePositionDisplay">Mouse position:</p>
  <script>
    var bodyElement = document.getElementById('bodyTag');
    bodyElement.addEventListener('click', cancelLink, 'false');
    bodyElement.addEventListener('mousemove', reportMousePosition, 'false');
     
    function cancelLink() {
      if (window.event.srcElement.tagName == "A" && window.event.shiftKey) {
        window.event.returnValue = false;
      }
    }
    
    function reportMousePosition() {
      document.getElementById('mousePositionDisplay').innerHTML = "Mouse position: (" + window.event.x + ", " + window.event.y + ")";
    }
  </script>
</body>

</html>

 

 

Show:
© 2014 Microsoft