Simulate a button click via JavaScript
March 5th, 2008 | Published in javascript | 19 Comments
There is a rare need for this type of functionality but I have found myself in a couple of situations where I needed it. Here is a quick demo of a button click that is simulated from another event handler. In this case, the button click is invoked by checking a checkbox.
Here is the HTML code including the JavaScript:
1 2 3 | <input type="checkbox" onClick="document.getElementById('theSubmitButton').click();">Check the box to simulate a button click <br> <input type="button" name="theSubmitButton" id="theSubmitButton" value="Button" onClick="alert('The button was clicked.');"> |
If the button is clicked directly, a JavaScript alert will pop up with the following message:
The button was clicked.
The onClick event handler for the checkbox will access the HTML DOM button object and invoke the click() method. This simulates the button click and invokes the alert.
Customize message
March 25th, 2008 at 8:24 am (#)
its nice …thanx a lot
[Reply]
April 22nd, 2008 at 1:36 am (#)
Nice code … thanks
[Reply]
July 2nd, 2008 at 8:47 am (#)
Neat!
[Reply]
August 28th, 2008 at 6:12 am (#)
Very Nice!
But do you know how to set this kind of click on a link object with HREF instead ONCLICK?
Thanks.
[Reply]
Knix reply on August 28th, 2008 7:05 am:
Hi Henrique,
Yes, you can try the following instead:
[Reply]
August 5th, 2009 at 2:05 pm (#)
Can you replace the button with a hyperlink?
[Reply]
Knix reply on August 5th, 2009 2:17 pm:
Yes, it should work!
http://www.webmasterworld.com/forum91/762.htm
[Reply]
Miguel Céspedes reply on August 5th, 2009 3:14 pm:
Thanks but not is what I’m looking for.
I want to call “Mediabox” from a button
This is the link:
play flash video »
And this is the library:
http://iaian7.com/webcode/Mediabox
[Reply]
Miguel Céspedes reply on August 5th, 2009 3:25 pm:
The link contains attributes:
<a href="http://iaian7.com/media/2007/06/2007vfx.flv" rel="mediabox[640 360]" title="flash video">play flash video »</a>
August 20th, 2009 at 5:53 am (#)
Hi, I’m looking for something like this:
function fireEvent (x, y, type) {…}
Does somebody know’s any function like above?
Because I need to simulate an event at X,Y with the mouse.
Example: fireEvent( 100, 50, “mousedown” );
Thanks.
[Reply]
October 16th, 2009 at 12:58 pm (#)
What if you have an control and you are trying to simulate the click event? I’m trying to fire a server-side event that’s why i need the asp:button.
You can’t use getElementById(“Button_ID”) right? Do you need the ClientID?
Thanks…
[Reply]
Steve reply on November 20th, 2009 7:31 pm:
This is great and halfway to what I need. I actually want to simulate a button push when a certain key is pressed.
What I have is a web page that shows video clips. I have “prev” and “next” buttons. Sometimes the buttons are (intentionally) off the visible page. What I want to do is capture keys to simulate a button click. The button push actually results in the page being reloaded with the prev/next video clip. So I’m not using checkboxes just a plain old key capture. The way it works is that once the page is loaded if I click anywhere on the page (document)it gives it focus and then when I click the appropriate key (P/N) it does what I would expect. However because it reloads the page I lose focus and so have to click on the page again. (Yeah probably bad design in the first place but it is what it is at this point.) So I tried to get around this by something like or but it doesn’t seem to work. So my question is how do I set focus on the document itself after it loads? (Oh and this is a page within a frameset to boot. :-) )
[Reply]
November 6th, 2009 at 8:54 am (#)
Also it is possible this elegant simulation:
Play a song!
[Reply]
January 14th, 2010 at 3:48 am (#)
Is that possible to send a parametter to the submit button ? I have a VB function in the code beheind and i had multiple button who are supposed to active the VB function but whith a parametter. How can i do that ?
Thanks for the exemple by the way :)
(and sorry for my english)
[Reply]
February 9th, 2010 at 8:58 am (#)
I was looking for this exactly. Very helpful! Cheers!
[Reply]
March 4th, 2010 at 3:05 am (#)
Great! Solved my problem. :)
Thank you man. You guys make life easier for us.
[Reply]
July 1st, 2010 at 6:30 am (#)
Thanks a lOt!
[Reply]
July 5th, 2010 at 4:13 am (#)
[...] Usage of JavaScript, which may be turned off on some computers, plain HTML is faster by default, … [...]
July 17th, 2010 at 4:08 am (#)
Thanks! When submit() (for some unknown reason…) didn’t work, this is nice :)
[Reply]