---

Search posts under JavaScript:

---

OnFocus in JavaScript

How to execute a JavaScript function on focus of the element?

In case we have to execute a JavaScript function on focus of the element, we can use this approach.

Enter your name:
    <input type="text" name="txtName" id="txtName" onfocus="GotFocus(this.id)" />
    <input type="button" id="btn" name="btn" value="Submit" />
    
    <script>
        function GotFocus(id) {
            document.getElementById(id).style.background = "#c0c0c0";
        }
    </script>

In the above code snippet, we have a textbox with onfocus event. When we focus (place cursor) on the textbox, GotFocus function executes that receives the id of the textbox that causes this event to execute. In this function, we are finding the texbox (using it's id passed into function) and setting its background color to “#c0c0c0”.

OUTPUT