Home >>jQuery Tutorial >jQuery focusin() Method

jQuery focusin() Method

jQuery focusin() Method

jQuery focusin() method in jQuery is used to run a add function when a focus event occurs on the element, or any elements inside it.

Syntax:
$(selector).focusin(function)

Parameter Values

Parameter Description
function It is a required parameter and is used to specifies the function to run when the focusin event occurs.
Here is an Example of jQuery focusin() Method:

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$(".box").focusin(function(){
$(this).css("background-color", "orange");
});
$(".box").focusout(function(){
$(this).css("background-color", "#FFFFFF");
});
});
</script>
</head>
<body>
<div class="box" style="border: 1px solid black;padding:8px;">
Fname: <input type="text"><br>
Lname: <input type="text">
</div>
<p>Click in above input field to get focus and click outside an input field to lose focus.</p>
</body>
</html>

Output:
Fname:
Lname:

Click in above input field to get focus and click outside an input field to lose focus.