Created
May 26, 2018 20:26
-
-
Save mskasal/4b0b60934b5082ef456632774afc6d54 to your computer and use it in GitHub Desktop.
fireEvent with javascript
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/** | |
* Fire an event handler to the specified node. Event handlers can detect that the event was fired programatically | |
* by testing for a 'synthetic=true' property on the event object | |
* @param {HTMLNode} node The node to fire the event handler on. | |
* @param {String} eventName The name of the event without the "on" (e.g., "focus") | |
*/ | |
function fireEvent(node, eventName) { | |
// Make sure we use the ownerDocument from the provided node to avoid cross-window problems | |
var doc; | |
if (node.ownerDocument) { | |
doc = node.ownerDocument; | |
} else if (node.nodeType == 9){ | |
// the node may be the document itself, nodeType 9 = DOCUMENT_NODE | |
doc = node; | |
} else { | |
throw new Error("Invalid node passed to fireEvent: " + node.id); | |
} | |
if (node.dispatchEvent) { | |
// Gecko-style approach (now the standard) takes more work | |
var eventClass = ""; | |
// Different events have different event classes. | |
// If this switch statement can't map an eventName to an eventClass, | |
// the event firing is going to fail. | |
switch (eventName) { | |
case "click": // Dispatching of 'click' appears to not work correctly in Safari. Use 'mousedown' or 'mouseup' instead. | |
case "mousedown": | |
case "mouseup": | |
eventClass = "MouseEvents"; | |
break; | |
case "focus": | |
case "change": | |
case "blur": | |
case "select": | |
eventClass = "HTMLEvents"; | |
break; | |
default: | |
throw "fireEvent: Couldn't find an event class for event '" + eventName + "'."; | |
break; | |
} | |
var event = doc.createEvent(eventClass); | |
var bubbles = eventName == "change" ? false : true; | |
event.initEvent(eventName, bubbles, true); // All events created as bubbling and cancelable. | |
event.synthetic = true; // allow detection of synthetic events | |
node.dispatchEvent(event, true); | |
} else if (node.fireEvent) { | |
// IE-old school style | |
var event = doc.createEventObject(); | |
event.synthetic = true; // allow detection of synthetic events | |
node.fireEvent("on" + eventName, event); | |
} | |
}; | |
// Example usage | |
document.getElementsByTagName("button")[0].onclick = function() { | |
fireEvent(document.getElementsByTagName("a")[0], "click"); | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment