85

In IE, I can just call element.click() from JavaScript - how do I accomplish the same task in Firefox? Ideally I'd like to have some JavaScript that would work equally well cross-browser, but if necessary I'll have different per-browser JavaScript for this.

1
  • 1
    This question was also answered here.
    – user488071
    Commented Dec 10, 2010 at 20:45

7 Answers 7

117

The document.createEvent documentation says that "The createEvent method is deprecated. Use event constructors instead."

So you should use this method instead:

var clickEvent = new MouseEvent("click", {
    "view": window,
    "bubbles": true,
    "cancelable": false
});

and fire it on an element like this:

element.dispatchEvent(clickEvent);

as shown here.

5
  • 2
    Excellent solution for Chrome. The code to get the element that then executes dispatchEvent(clickEvent); for me was: var element = document.getElementById("id-tag");
    – kbpontius
    Commented Apr 8, 2015 at 3:15
  • 1
    Works every time, whereas element.click() works not every time and is not reliable, especially on mobile devices.
    – Christian
    Commented Nov 29, 2018 at 8:54
  • 2
    does not work for dynamically added elements
    – Cybernetic
    Commented Nov 1, 2022 at 20:58
  • How about click()? Any drawback?
    – rlatief
    Commented Jun 8, 2023 at 10:54
  • 3
    Yes, this one: stackoverflow.com/questions/809057/…. Commented Jun 8, 2023 at 18:03
31

For firefox links appear to be "special". The only way I was able to get this working was to use the createEvent described here on MDN and call the initMouseEvent function. Even that didn't work completely, I had to manually tell the browser to open a link...

var theEvent = document.createEvent("MouseEvent");
theEvent.initMouseEvent("click", true, true, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
var element = document.getElementById('link');
element.dispatchEvent(theEvent);

while (element)
{
    if (element.tagName == "A" && element.href != "")
    {
        if (element.target == "_blank") { window.open(element.href, element.target); }
        else { document.location = element.href; }
        element = null;
    }
    else
    {
        element = element.parentElement;
    }
}
2
  • 2
    how does it differe from window.open(element.href, element.target) - at my Firefox it works exactly the same, and displays the ugly yellow bar
    – iirekm
    Commented Dec 6, 2010 at 14:45
  • 1
    If you set the third last parameter of MouseEvent to true (meaning that metaKey (CMD) button was held down when you clicked), this would not open the tab in a background tab, right? Or would it?
    – Magne
    Commented Apr 23, 2014 at 13:13
27

Using jQuery you can do exactly the same thing, for example:

$("a").click();

Which will "click" all anchors on the page.

1
  • 20
    Just as a note, this work when the href uses onclick, eg <a onclick="someFunction()>Click me</a> but not when using this format <a href="javascript:someFunction()">Click me</a> Commented Aug 17, 2011 at 3:29
13

element.click() is a standard method outlined by the W3C DOM specification. Mozilla's Gecko/Firefox follows the standard and only allows this method to be called on INPUT elements.

1
  • 8
    Understood, but not helpful when I want to programmatically simulate clicks on non-INPUT elements.
    – Bruce
    Commented Apr 30, 2009 at 21:15
9

Here's a cross browser working function (usable for other than click handlers too):

function eventFire(el, etype){
    if (el.fireEvent) {
      el.fireEvent('on' + etype);
    } else {
      var evObj = document.createEvent('Events');
      evObj.initEvent(etype, true, false);
      el.dispatchEvent(evObj);
    }
}
2
  • 1
    I found I needed to use el[etype](); on line 3 to get IE to fire the native event (i was testing with a click handler - see jsfiddle.net/Pc8qE) Commented Aug 4, 2011 at 6:44
  • 1
    To get this to work I had to use a input of type submit for firefox and an input of type button for IE.
    – user220583
    Commented Feb 20, 2013 at 12:14
8

Are you trying to actually follow the link or trigger the onclick? You can trigger an onclick with something like this:

var link = document.getElementById(linkId);
link.onclick.call(link);
4
  • 1
    interesting, I'll give that a try. This is part of a testing harness, so we don't know ahead of time what specific element we are going to be clicking on - it is whatever the test case specifies.
    – Bruce
    Commented Apr 30, 2009 at 21:16
  • 3
    You don't need to specify a context; since onclick is a property of 'link' the context will already be set appropriately.
    – James
    Commented Apr 30, 2009 at 21:21
  • 2
    This didn't work in Chrome. An error was thrown in the console saying the method "call" didn't exist.
    – kbpontius
    Commented Apr 8, 2015 at 3:16
  • 1
    You must have mistyped. call() is part the Function prototype. It's definitely there.
    – jiggy
    Commented Apr 8, 2015 at 17:27
1

I used KooiInc's function listed above but I had to use two different input types one 'button' for IE and one 'submit' for FireFox. I am not exactly sure why but it works.

// HTML

<input type="button" id="btnEmailHidden" style="display:none" />
<input type="submit" id="btnEmailHidden2" style="display:none" />

// in JavaScript

var hiddenBtn = document.getElementById("btnEmailHidden");

if (hiddenBtn.fireEvent) {
    hiddenBtn.fireEvent('onclick');
    hiddenBtn[eType]();
}
else {
    // dispatch for firefox + others
    var evObj = document.createEvent('MouseEvent');
    evObj.initEvent(eType, true, true);
    var hiddenBtn2 = document.getElementById("btnEmailHidden2");
    hiddenBtn2.dispatchEvent(evObj);
}

I have search and tried many suggestions but this is what ended up working. If I had some more time I would have liked to investigate why submit works with FF and button with IE but that would be a luxury right now so on to the next problem.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.