This tutorial will help you to how to call a JavaScript function on click or submit events of various html controls.
Create JavaScript Function –
First, Create a JavaScript function like below and add this between <head>…</head> tag of your web page. You may also add function under separate JavaScript file and include in html page.
1 2 3 4 5 6 | <script type="text/javascript"> function myFunction() { var dt = new Date(); alert(dt); } </script> |
Now, Call above JavaScript function on Click events of various html controls. These HTML controls needs to put under <body> tag of web page.
1. On Hyper link Click
Add below HREF html code in body section and access on web browser. Now just click link, It will execute JavaScript’s myFunction which will show current date as per used above.
1 | <a href="javascript:void(0);" onclick="myFunction();"> click here </a> |
2. On Form Submit
Now call JavaScript function of form submit event. This is useful for validating form input values and then submit them.
1 2 3 4 | <form id="myForm" method="post"> Name: <input name="name" id="name" type="text" /><br /> <input type="button" id="form1" onclick="myFunction();" value="Submit" /> </form> |
3. On Button Click
Now call JavaScript function of button click event.
1 | <button onclick="myFunction();">click here </button> |
4. On Link with P Tag
Now call JavaScript function link created using html “p” tag.
1 | <p id="demo" onclick="myFunction()">click here </p> |
Leave a Reply