Javascript click function

Question

I've got some code which works fine in IE but unfortunately not in Google Chrome/Firefox.

It relies upon calling a click() event on a button from javascript. Reading around it seems that this is an IE specific extension (doh). Is there any way I can do a similar thing in chrome + firefox? To clarify, it's executing the click event on a specific button, not handling what happens when the user clicks on a button.

Thanks

The code for those who asked for it:

function getLinkButton(actionsDiv)
{
    var hrefs = actionsDiv.getElementsByTagName("a");
    for (var i=0; i<hrefs.length; i++)
    {
        var id = hrefs[i].id;
        if (id !=null && id.endsWith("ShowSimilarLinkButton"))
        {
            return hrefs[i];
        }
    }
    return null;
}

function doStuff()
{
  //find the specific actions div... not important code...
  var actionsDiv = getActionsDiv(); 
  var linkButton = getLinkButton(actionsDiv);

  if (linkButton != null)
  {
    if (linkButton.click)
    {
        linkButton.click();
    }
    else
    {
        alert("Cannot click");
    }
  }
}

I don't really want to use jQuery unless absolutely necessary

please show the code, because click event works on chrome,firefox,.. — N 1.1
– N 1.1, Commented Mar 18, 2010 at 11:20
@nvl: I think he's wanting to dispatch the "click" event handler set on the button. — Andy E
– Andy E, Commented Mar 18, 2010 at 11:33

Andy E · Accepted Answer · 2010-03-18 12:51:53Z

2

I think you're looking for element.dispatchEvent:

function simulateClick() {
  var evt = document.createEvent("MouseEvents");
  evt.initMouseEvent("click", true, true, window,
    0, 0, 0, 0, 0, false, false, false, false, 0, null);
  var cb = document.getElementById("checkbox"); 
  var canceled = !cb.dispatchEvent(evt);
  if(canceled) {
    // A handler called preventDefault
    alert("canceled");
  } else {
    // None of the handlers called preventDefault
    alert("not canceled");
  }
}

I read your question as "I'm trying to fire the onclick event for my button", whereas everyone else seems to have read it as "I'm trying to handle an onclick event for my button". Please let me know if I've got this wrong.

Modifying your code, a proper x-browser implementation might be:

if (linkButton != null) 
{ 
  if (linkButton.fireEvent) 
    linkButton.fireEvent("onclick"); 
  else 
  { 
    var evt = document.createEvent("MouseEvents");
    evt.initMouseEvent("click", true, true, window,
                               0, 0, 0, 0, 0, false, false, false, false, 0, null);
    linkButton.dispatchEvent(evt);
  } 
}

edited Mar 18, 2010 at 12:51

answered Mar 18, 2010 at 11:24

Andy E

346k86 gold badges482 silver badges452 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Gordon Thompson Over a year ago

Andy E Over a year ago

@Gordon: fireEvent works in IE too, so you can do away with the click(). I left a reference to element in the code that I meant to change to linkButton - element.dispatchEvent(evt); should be linkButton.dispatchEvent(evt);

Gordon Thompson Over a year ago

ah, found out why this code wasn't working in Firefox devtoolshed.com/content/fix-firefox-click-event-issue Firefox does not support the javascript click() event on a hyperlink (rendered by a LinkButton). The solution was to make it into a Button.

Community · Accepted Answer · 2017-05-23 12:01:12Z

1

onclick attribute should be crossbrowser:

<input type="button" onclick="something()" value="" />

EDIT

And there was this question that seems to be about the same problem: setAttribute, onClick and cross browser compatibility

edited May 23, 2017 at 12:01

CommunityBot

11 silver badge

answered Mar 18, 2010 at 11:20

OverLex

2,5211 gold badge24 silver badges28 bronze badges

Comments

Brian Mains · Accepted Answer · 2010-03-18 11:21:17Z

0

onclick="methodcall();" works for me fine...

answered Mar 18, 2010 at 11:21

Brian Mains

50.8k35 gold badges155 silver badges260 bronze badges

Comments

Kasia Gogolek · Accepted Answer · 2010-03-18 11:22:02Z

0

you can use onClick attribute or if you need more functionality have a look at jQuery and events it offers: http://api.jquery.com/category/events/

answered Mar 18, 2010 at 11:22

Kasia Gogolek

3,4044 gold badges35 silver badges51 bronze badges

Collectives™ on Stack Overflow

Javascript click function

4 Answers 4

3 Comments

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

3 Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related