How to get focused a button automatically when the page load using HTML ?
The <button> tag in HTML is used to define the clickable button. The <button> tag is used to submit the content. The images and text content can use inside <button> tag.
The <button> autofocus attribute is used to get focused button automatically after loading the web pages.
Syntax:
<button type="" autofocus> Submit <button>
Example 1:
HTML
<!DOCTYPE html> <html> <body> <h1 style="color:green;"> GeeksforGeeks </h1> <h3> How to specify that a button should automatically get focus when the page load? </h3> <!-- button tag starts from here --> <button type="button" autofocus onclick="alert('Welcome to GeeksforGeeks')"> Click Here </button> <!-- button tag ends here --> </body> </html> |
Output:
On click of the submit button, the following alert message box is shown to the user.
Example 2:
HTML
<!DOCTYPE html> <html> <body> <h1 style="color:green;"> GeeksforGeeks </h1> <h3> How to specify that a button should automatically get focus when the page load? </h3> <!-- button tag starts from here --> <button type="button" autofocus onclick="myFun()"> Click Here </button> <!-- button tag ends here --> <p id=result></p> <script> function myFun() { document.getElementById("result") .innerHTML = "Welcome to GeeksforGeeks"; } </script> </body> </html> |
Output:
Please Login to comment...