jQuery focusin() Method

Last Updated:

jQuery focusin() Method

The jQuery focusin() method is triggered when a specified element gets focus.

This method is often used with jQuery focusout() method.

Note: Unlike the focus() method, the focusin() method also triggers if any of its child elements get focus.

Example

HTML Editor
<!DOCTYPE html> <html lang="en-US"> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> </head> <body> <h1>jQuery focusin() Method</h1> <input type="text" placeholder="focusin"> <script> $(document).ready(function(){ $("input").focusin(function(){ $("input").css("padding", "10px"); }); $("input").focusout(function(){ $("input").css("padding", "0"); }); }); </script> </body> </html>

Syntax

$(selector).focusin(callback);

Parameter Values

Value Type Explanation
callback Required Specifies the function to run when the focusin event occurs.

Browser Support

Devicedesktopmobile
Browsergoogle chromesafarifirefoxinternet Exploreredgeoperagoogle chromesafarifirefoxedgeoperaandroid webviewsamsung internet
focusin()YesYesYesYesYesYesYesYesYesYesYesYesYes

Share this Page

Meet the Author