In order to access this site you need to enable JavaScript!

You are here: Reference > JavaScript > client-side > event handling > methods > fireEvent

fireEvent method

Browser support:

Initializes an event object and dispatches it to the current element.

To create an event object, use the createEventObject method in Internet Explorer. The created event can be passed as a second parameter of the fireEvent method.

In Firefox, Opera, Google Chrome, Safari and Internet Explorer from version 9, use the createEvent method to create a new event object. After the new event is created, initialize it first (for details, see the page for the createEvent method). When the event is initialized, it is ready to be dispatched with the dispatchEvent method.

Although Internet Explorer 9 supports the createEventObject method, but the createEvent method is cross-browser and it provides more complex functionality, so it is preferred to use.

Note: the main difference between the dispatchEvent and fireEvent methods is that the dispatchEvent method invokes the default action of the event, the fireEvent method does not. See Example 2 for details.

If you need to simulate a mouse click on an element, use the click method.
To set or remove the focus from an element, use the focus and blur methods.

Syntax:

object.fireEvent (eventName [, eventObj]);

You can find the related objects in the Supported by objects section below.

Parameters:

eventName

Required. String that specifies the name of the event to dispatch. This parameter is case-insensitive.
For a complete list of events, see the page for Events in JavaScript.

eventObj

Optional. Reference to an event object to dispatch. The cancelBubble, returnValue, srcElement and type properties of the specified event object will be overridden. If this parameter is not specified, an event object is generated in the background for dispatching. The mentioned properties will also be set for the generated event object.

Return value:

Boolean that indicates whether the event was not canceled. An event is canceled if an event handler calls the preventDefault method or sets the returnValue property to false or returns false.

One of the following values:

false	The event was canceled.
true	The event was not canceled.

Example HTML code 1:

This example illustrates the use of the dispatchEvent and fireEvent methods:

<head>
    <script type="text/javascript">
        function InitMouseDown (event) {
                if (event.initMouseEvent) {     // all browsers except IE before version 9
                    var mousedownEvent = document.createEvent ("MouseEvent");
                    mousedownEvent.initMouseEvent ("mousedown", true, true, window, 0, 
                                                event.screenX, event.screenY, event.clientX, event.clientY, 
                                                event.ctrlKey, event.altKey, event.shiftKey, event.metaKey, 
                                                0, null);
                    event.target.dispatchEvent (mousedownEvent);
                } else {
                    if (document.createEventObject) {   // IE before version 9
                        var mousedownEvent = document.createEventObject (window.event);
                        mousedownEvent.button = 1;  // left button is down
                        event.srcElement.fireEvent ("onmousedown", mousedownEvent);
                    }
                }
        }
    </script>
</head>
<body>
    <button onmouseover="InitMouseDown (event);" onmousedown="alert ('mousedown event occurred')">
        Hover over this button!
    </button>
</body>

Copy Code

Preview

Syntax Highlighter

Did you find this example helpful? yes no

Example HTML code 2:

This example illustrates the difference between the dispatchEvent and fireEvent methods. The dispatchEvent method invokes the default action of the event, the fireEvent method does not:

<head>
    <script type="text/javascript">
        function InitClick (event) {
                if (event.initMouseEvent) {     // all browsers except IE before version 9
                    var clickEvent = document.createEvent ("MouseEvent");
                    clickEvent.initMouseEvent ("click", true, true, window, 0, 
                                                event.screenX, event.screenY, event.clientX, event.clientY, 
                                                event.ctrlKey, event.altKey, event.shiftKey, event.metaKey, 
                                                0, null);
                    event.target.dispatchEvent (clickEvent);
                } else {
                    if (document.createEventObject) {   // IE before version 9
                        var clickEvent = document.createEventObject (window.event);
                        clickEvent.button = 1;  // left click
                        event.srcElement.fireEvent ("onclick", clickEvent);
                    }
                }
        }
    </script>
</head>
<body>
    <input type="checkbox" onmouseover="InitClick (event);" onclick="alert ('click event occurred')"/>Hover over the check box!
</body>

Copy Code

Preview

Syntax Highlighter

Did you find this example helpful? yes no

Supported by objects:

CommentNode

HTML elements:

a, abbr, acronym, address, applet, area, b, base, basefont, bdo, bgsound, big, blockquote, body, br, button, caption, center, cite, code, col, colgroup, comment, dd, del, dfn, dir, div, dl, dt, em, embed, fieldset, font, form, frame, frameset, h1, h2, h3, h4, h5, h6, head, hr, html, i, iframe, img, input:button, input:checkbox, input:file, input:hidden, input:image, input:password, input:radio, input:reset, input:submit, input:text, ins, isindex, kbd, label, legend, li, link, listing, map, marquee, menu, meta, nobr, noframes, noscript, object, ol, optgroup, option, p, param, plaintext, pre, q, rt, ruby, s, samp, script, select, small, span, strike, strong, style, sub, sup, table, tbody, td, textarea, tfoot, th, thead, title, tr, tt, u, ul, var, wbr, xml, xmp

createEventObject
createEvent
dispatchEvent
blur
click
focus

External links:

fireEvent (MSDN)

Digg Del.icio.us Reddit Facebook Twitter Diigo

User Contributed Comments

Page Notes

the Internet Explorer fireEvent method is not fully implemented, even for built-in events

I tested fireEvent in Internet Explorer 8.0.6001, and for roughly a fourth of the events known to Internet Explorer, fireEvent returns an Invalid Argument error.

In more detail, here first are the twenty events for which fireEvent is NOT implemented: onabort onafterprint onbeforeprint onbeforeunload onbounce onchange onerror onfinish onhashchange onload onmessage onoffline ononline onreset onselect onselectionchange onstart onstop onsubmit onunload.

Here are the 59 events for which fireEvent returns true: onactivate onafterupdate onbeforeactivate onbeforecopy onbeforecut onbeforedeactivate onbeforeeditfocus onbeforepaste onbeforeupdate onblur oncellchange onclick oncontextmenu oncontrolselect oncopy ondataavailable ondatasetchanged ondatasetcomplete ondblclick ondeactivate ondrag ondragend ondragenter ondragleave ondragover ondragstart ondrop onerrorupdate onfilterchange onfocus onfocusin onfocusout onhelp onkeydown onkeyup onlosecapture onmousedown onmouseenter onmouseleave onmousemove onmouseout onmouseup onmousewheel onmove onmoveend onmovestart onpaste onpropertychange onreadystatechange onresize onresizeend onresizestart onrowenter onrowexit onrowsdelete onrowsinserted onscroll onselectstart

Finally, fireEvent returns false for the remaining event, namely onmouseover.