You are here: Reference > JavaScript > client-side > event handling > events > onmessage

onmessage event | message event

Browser support:
Occurs when the postMessage method sends a message to the current window.
Note: The onmessage event is supported in Firefox from version 3 and in Internet Explorer from version 8.
For security restrictions, the contents of a document cannot be accessed from another document in JavaScript, if the two documents are located in different domains. If you need to communicate between two documents regardless of their location, invoke the postMessage method on the window object that contains the target document. When the postMessage method is invoked, then a message event is fired on the target window.
The event object for a message event supports the following additional properties:
  • the data property contains the message,
  • the origin property retrieves the scheme, hostname and port of the document that invoked the postMessage method,
  • the source property refers to the window object that contains the document that invoked the postMessage method,
  • the lastEventId property returns the identifier of the last message.
Note: The origin property is supported in Opera from version 10. In earlier versions, it supports the uri and domain properties instead. In Opera 10, the support for the uri and domain properties has been removed.
See the example for further details.

How to register:

This event cannot be registered in HTML.

In JavaScript:
object.onmessage = handler;
object.addEventListener ("message", handler, useCapture);
object.attachEvent ("onmessage", handler);
You can find the related objects in the Supported by objects section below.
The event object is accessible to all event handlers in all browsers. The properties of the event object contain additional information about the current event. To get further details about these properties and the possible event handler registration methods, please see the page for the event object.
For a complete list of events, see the page for Events in JavaScript.

Basic information:

Bubbles No
Cancelable Yes
Event object MessageEvent

Actions that invoke the message event:

Example HTML code 1:

This example illustrates the use of the message event.
    <script type="text/javascript">
        function Init () {
            if (window.addEventListener) {  // all browsers except IE before version 9
                window.addEventListener ("message", OnMessage, false);
            else {
                if (window.attachEvent) {   // IE before version 9
                    window.attachEvent("onmessage", OnMessage);

        function GetState () {
            var frame = document.getElementById ("myFrame");
                // send the 'getstate' message to the frame window
            var message = "getstate";
            if (frame.contentWindow.postMessage) {
                frame.contentWindow.postMessage (message, "*");
            else {
                alert ("Your browser does not support the postMessage method!");

        function OnMessage (event) {
            var message =;
            var arr = message.split (",");
            if (arr[0] == "true") {
                alert ("The check box is checked.");
            else {
                alert ("The check box is not checked.");

            var selIndex = Number (arr[1]);
            alert ("The " + (selIndex + 1) + ". option is selected.");
<body onload="Init ();">
    <iframe id="myFrame" src="message.htm" width="500" height="200px"></iframe>
    <br /><br />
    <button onclick="GetState ()">Get the state of controls in the frame</button>
Did you find this example helpful? yes no

Supported by objects:

Related pages:

External links:

User Contributed Comments

Post Content

Post Content