Open In App

HTML | onfocus Event Attribute

Improve
Improve
Like Article
Like
Save
Share
Report

This onfocus attribute works when the element gets focused. This event attribute is mostly used with <input>, <select>, <a> elements. This event attribute is supported by all HTML elements excepts <base>, <bdo>, <br>, <head>, <html>, <iframe>, <meta>, <param>, <script>, <style>, and <title> elements.
Supported Tags: It supports all HTML elements which are given below: 

  • <base> 
  •  <bdo>
  •  <br>
  •  <head>
  •  <html>
  •  <iframe>
  •  <meta>
  •  <param>
  •  <script>
  •  <style>
  •   <title>

Syntax: 
 

<element onfocus = "script">

Attribute Value: The script value run when onfocus attribute called.
Example: 
 

html




<!DOCTYPE html>
<html>
    <head>
        <title>onfocus attribute</title>
        <style>
            h1 {
                color:green;
            }
            body {
                text-align:center;
            }
            input {
                color:white;
                margin-top:5px;
                border:1px solid black;
                border-radius:3px;
            }
        </style>
        <script>
            function sudo(x) {
                document.getElementById(x).style.background = "green";
            }
        </script>
    </head>
    <body>
        <h1>GeeksforGeeks</h1>
        <h2>onfocus event attribute</h2>
        First name: <input type="text" id="fname"
        onfocus="sudo(this.id)"><br>
        Last name: <input type="text" id="lname"
        onfocus="sudo(this.id)">
    </body>


Output: 
 

Supported Browsers: The browser supported by onfocus attribute are listed below: 
 

  • Apple Safari 3.1
  • Google Chrome 1
  • Edge 12
  • Firefox 24
  • Opera 11.6
  • Internet Explorer 9

 



Last Updated : 16 Aug, 2022
Like Article
Save Article
Previous
Next
Share your thoughts in the comments
Similar Reads