How to get focused a button automatically when the page load using HTML ?
Last Updated :
01 Oct, 2020
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 type="button" autofocus
onclick="alert('Welcome to GeeksforGeeks')">
Click Here
</button>
</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 type="button" autofocus onclick="myFun()">
Click Here
</button>
<p id=result></p>
<script>
function myFun()
{
document.getElementById("result")
.innerHTML = "Welcome to GeeksforGeeks";
}
</script>
</body>
</html>
|
Output:
Like Article
Suggest improvement
Share your thoughts in the comments
Please Login to comment...