You are here: Reference > JavaScript > client-side > event handling > properties > originalTarget (event)

originalTarget property (event)

Browser support:
Returns a reference to the object on which the event originally occurred.
We recommend using the target property instead, because it is equivalent to the originalTarget property and supported not only by Firefox, but also by Opera, Google Chrome, Safari and Internet Explorer from version 9.
The explicitOriginalTarget is similar to the originalTarget property, but it always retrieves the exact target object while the originalTarget property sometimes returns the parent element of the exact target object. For example, if a span element contains some text (in that case, the span element has a TextNode child) and an onclick event occurs within the span element, then the explicitOriginalTarget property retrieves the TextNode while the originalTarget property returns the span element as the target.
If you need the element on which the event listener was registered, use the currentTarget property.
In Internet Explorer before version 9, use the srcElement property for similar functionality.
In case of activation and mouse move events, the fromElement, toElement and relatedTarget properties can also be useful. For example, the fromElement and relatedTarget properties retrieve the element that the mouse pointer left in case of the onmouseover event.

Syntax:

object.originalTarget;
You can find the related objects in the Supported by objects section below.
This property is read-only.

Possible values:

Reference to the object on which the event originally occurred.
Default: this property has no default value.

Example HTML code 1:

This example illustrates the use of the originalTarget property:
<head>
    <script type="text/javascript">
        function OnClick (event) {
            if (event.explicitOriginalTarget) { // Firefox
                alert ("The exact target of the event is the " + event.explicitOriginalTarget);
            }
            if (event.originalTarget) { // Firefox
                alert ("The target of the event is the " + event.target);
            }
            else {
                if (event.target) {     // Firefox, Opera, Google Chrome and Safari
                    alert ("The target of the event is the " + event.target);
                }
                else {  // Internet Explorer
                    alert ("The target of the event is the " + event.srcElement.tagName + " element");
                }
            }
        }
    </script>
</head>
<body onclick="OnClick (event);">
    <div>Click on this text first!</div>
    <br />
    <button>Click on this button next!</button>
</body>
Did you find this example helpful? yes no

Supported by objects:

Related pages:

External links:

User Contributed Comments

Post Content

Post Content