HTML | onfocus Event Attribute

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.

Syntax:

<element onfocus = "script">

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

Example:

<!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
Google Chrome
Firefox
Opera
Internet Explorer

My Personal Notes

Recommended Posts: