JavaScript onfocusin Event

February 8, 2021 10:45 am IST

You are Here:

JavaScript onfocusin Event

The onfocusin event occurs when an element is about to get focus.

Note: Unlike onfocus event, the onfocusin event will bubble, i.e., The element with onfocusin event will be affected when its child element gets focus.

onfocusin Event as Attribute

Example

HTML Online Editor

<!DOCTYPE html> <html> <body> <p>Type your Name</p> <input type="text" onfocusin="myFunction(this)"> <script> function myFunction(x){ x.style.color = "red"; } </script> </body> </html>

Run

Syntax

As Attribute

Using Event Listener

object.addEventListener("focusin" , myScript);

Using addEventListener() Method

Note: The addEventListener() method is not supported in Internet Explorer 8 and below.

Example

HTML Online Editor

<!DOCTYPE html> <html> <body> <p>Type your Name</p> <input type="text"> <script> var x = document.getElementsByTagName("input")[0]; function myFunction() { x.style.color = "red"; } x.addEventListener("focusin", myFunction); </script> </body> </html>

Run